0

我正在尝试制作一个 Chrome 扩展程序，它在加载时会找到字符串的第一个实例并添加一些详细信息以及链接。

据我所知，TreeWalker 是最好的方法，所以我改编了这个例子（Dom TreeWalker）。

这很好用（尽管我的实现效率低下）。但我希望效果是微妙的，所以我添加了字符串需要出现在段落中的要求，以减少替换任何菜单或标题中文本的机会。

现在行为不稳定（进行了一些替换，而另一些则没有）。

我知道我.replace最后的实施不是正确的解决方案。

有任何想法吗？

var companies = [
        "Apples",        
        "Black Beans",
        "Sweet Potatoes"
    ];
var re = new RegExp(companies.join("|"), "i");

var walker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW_TEXT,
  function(node) {
    var matches = node.textContent.match(re);
    //look for matching text but also accept only those in paragraphs
    if((matches) && (node.parentNode.nodeName == "P")) {       
      return NodeFilter.FILTER_ACCEPT;

    } else {
      return NodeFilter.FILTER_SKIP;
    }
  },
  false);

var nodes = [];

while(walker.nextNode()) {
  nodes.push(walker.currentNode);
}


node=nodes[0]; //just replace the first hit within a paragraph

node.parentNode.innerHTML = node.parentNode.innerHTML.replace("Apples", "Apples [nutritional fact <a href='http://nutritionalinfo.com/apples'>Apples</a> ]");
node.parentNode.innerHTML = node.parentNode.innerHTML.replace("Black Beans", "Black Beans [nutritional fact <a href='http://nutritionalinfo.com/apples'>Apples</a> ]");
node.parentNode.innerHTML = node.parentNode.innerHTML.replace("Sweet Potatoes", "Sweet Potatoes[nutritional fact <a href='http://nutritionalinfo.com/apples'>Apples</a> ]");
4

0 回答 0