javascript - 替换文本但保留谷歌浏览器扩展内容脚本中的链接

Question

我正在尝试替换 google chrome 上的文字，但遇到了问题。我能够成功地替换特定的单词，但它会杀死相关的 html 链接。

如何保持链接有效并替换文本？

这是我的 chrome 扩展内容脚本中的代码:

wordDict = {"the":"piano","and":"Hello", "a":"huh?"};

for (word in wordDict) {
    document.body.innerHTML = document.body.innerHTML.replace(
        new RegExp('\\b' + word + '\\b',"gi"), wordDict[word]
    );
};

Answer 1

我不是正则表达式方面的专家，所以这是一种在页面上找到一个包含一个词的超链接并将其替换为另一个词的解决方案。

for(var i = 0, l=document.links.length; i<l; i++) {
  if(document.links[i].innerText == "Word"){
    document.links[i].innerText = "Other Word";
  }
}

有了这个你可以避免正则表达式，但你仍然需要循环你的单词对象。

另一方面，既然你说你已经加载了 jQuery，那么这个 jQuery 解决方案会按照你的意图进行，它会在所有标签中查找单词并替换它们。

jQuery.each( wordDict , function( key, value ) {
  jQuery( "a" ).each(function(){
    if(jQuery(this).text().match(key)) jQuery(this).text(value);
  });
});

第一个 jQuery 每个循环字符串对象，第二个每个循环遍历页面上的所有 a 标记，如果有匹配项，它会根据对象上的值更改元素文本。