-1

HTML

<div id="main">
  <span>v</span>
  <div id="main_cursor"></div>
</div>

Javascript

function highlight_word() {
  var cursor = document.getElementById(area + '_cursor'),
    pe = cursor.previousElementSibling,
    ne = cursor.nextElementSibling;
  var word = [];

  f();
  word = word.join();
  if (isInArr(keywords_arr, word)) {
    f(true);
  };

  function f(p = false) {
    while ((pe === null ? " " : pe.innerHTML) !== " " ||
      (ne === null ? " " : ne.innerHTML) !== " ") {
      if (pe !== null) {
        while (pe.innerHTML !== " ") {
          p === true ? pe.style.color = "green" : word.push(pe.innerHTML);
          pe = pe.previousElementSibling;
        }; // end of while
        word = word.reverse();
      }; //end of if
      if (ne !== null) {
        while (ne.innerHTML !== " ") {
          p === true ? pe.style.color = "green" : word.push(ne.innerHTML);
          ne = ne.nextElementSibling;
        }; //end of while
      }; //end of if
    }; // end of while
  }; // end of function f
};

目的

目的は、最初に と の間にあるすべてのスパンの内部テキストを取得し、内部テキストmain_cursorとしてスペースを使用して、配列に単語 gets が存在するかどうかを確認することですkeywords_arr。その単語はその配列に存在し、それらすべてのスパンのテキストの色を変更します

または、単語が含まれている場合は強調表示するだけですkeyword_arr

エラー

キャッチされていない TypeError: null のプロパティ 'innerHTML' を読み取れません

エラーは行に表示されます-

while(pe.innerHTML!==" "){

これは、発生してはならない条件がpe!==null満たされた場合にのみ発生します。

私は何をすべきか？

4

1 に答える 1

2

このループの内側

while (pe.innerHTML !== " ") {
  p === true ? pe.style.color = "green" : word.push(pe.innerHTML);
  pe = pe.previousElementSibling;
}; // end of while

の値を再割り当てしていますpe。peに以前の兄弟がいない場合は、 に割り当てられnullます。

代わりに、条件を次のように変更して、それpeが有効であることを確認してから確認することができinnerHTMLます。

while (pe && pe.innerHTML !== " ") {
于 2016-03-24T17:06:13.163 に答える