Расширение Javascript Chrome для замены слов определениями приводит к бесконечному циклу - PullRequest
0 голосов
/ 19 января 2019

В настоящее время я пытаюсь кодировать расширение Javascript Chrome, чтобы выделить некоторые слова и добавить их определения во всплывающую подсказку.Кажется, все работает, за исключением того, что некоторые определения, которые я хочу добавить, также содержат слова, которые должны быть выделены на исходной странице.В результате получается некий цикл: некоторые слова внутри всплывающей подсказки подсвечиваются, и поверх первой создается новая всплывающая подсказка и т. Д.

Я попытался выяснить, как пропустить узлы с помощью подсказки ''имя класса, но не попало ни на что, что работает правильноЭто действительно расстраивает.

Я искал подобные проблемы, но не мог найти ничего полезного.Я уверен, что упустил что-то действительно простое, но я не могу понять, что.

Вот моя функция, отвечающая за замену нужных узлов.Кто-нибудь может определить, почему он входит в описанный цикл?

    function replaceNode(node){
  if(node.nodeName !== '#text' || node.parentNode.nodeName === 'SCRIPT' || node.parentNode.nodeName === 'STYLE' || node.parentNode.className == 'tooltip'
     || node.parentNode.className == 'tooltipcontent'){
    console.log('error node type');
    return;
  }

 let content = node.textContent;
 console.log('current content:'+content);

for(let [word, def] of glossary){
  let regex = rgx.get(word);
  content = content.replace(regex, def);
  }

if(content !== node.textContent){
  let newSpan = document.createElement('span');
  newSpan.innerHTML = content;
  node.parentNode.replaceChild(newSpan, node);
  console.log('node replaced');
  }
}

А есть обходчик дерева:

function walkDoc(target){
      let treeWalker = document.createTreeWalker(target, NodeFilter.SHOW_TEXT, {acceptNode : function(node){
                          if(node.textContent.length === 0){
                            return NodeFilter.FILTER_SKIP;
                          }
                          return NodeFilter.FILTER_ACCEPT;
      }
    }, false);
    console.log('treewalker created');

    nodeList = [];
    console.log('nodelist created');

     while(treeWalker.nextNode()){
       nodeList.push(treeWalker.currentNode);
     }
     console.log(nodeList);
     i = 1;

     nodeList.forEach(function(n){
       console.log('node '+i);
       replaceNode(n);
       i++;
     });
    }

И это формат слов, используемых для замены исходных.:

<span class='tooltip'>the<span class='tooltipcontent'>This is a test to check if this extension works and shows this content as a tooltip.</span></span>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...