javascript - 检查并替换文本/节点 Chrome 扩展程序中的多个字符串

Question

所以我正在创建一个 chrome 扩展，其中我将 school 一词替换为 jail (该代码是为挪威人编写的，因此它说 skole 不是学校，而 fengsel 而不是 jail )

这是我当前的 JavaScript 代码:

var elements = document.getElementsByTagName('*');

for(var i = 0; i<elements.length; i++){
var element = elements[i];

for(var j = 0; j < element.childNodes.length; j++){
    var node = element.childNodes[j];

    if(node.nodeType === 3){
        var text = node.nodeValue;
        var replacedText = text.replace(/skolenes/gi, 'fengselenes');
        var replacedText1 = text.replace(/skolene/gi, 'fengselene');
        var replacedText2 = text.replace(/skolen/gi, 'fengselet');
        var replacedText3 = text.replace(/skoler/gi, 'fengsler');
        var replacedText4 = text.replace(/skole/gi, 'fengsel');

        if(replacedText !== text){
            element.replaceChild(document.createTextNode(replacedText), node);
        }else if(replacedText1 !== text){
            element.replaceChild(document.createTextNode(replacedText1), node);
        }else if(replacedText2 !== text){
            element.replaceChild(document.createTextNode(replacedText2), node);
        }else if(replacedText3 !== text){
            element.replaceChild(document.createTextNode(replacedText3), node);
        }else if(replacedText4 !== text){
                  element.replaceChild(document.createTextNode(replacedText4), node);
              }
    }
}
}

这是我的 list :

{
"manifest_version" : 2,
"name": "Skole er fengsel",
"description": "Endre ordet skole til fengsel",
"version": "0.0.1",
"content_scripts": [
    {
        "matches": [
            "http://*/*",
            "https://*/*"
            ],
            "js": [
                "content.js"
                ],
                "run_at": "document_end"
    }
]
}

因此，通过这段代码，我可以更改句子:Skole er bra for skolen。致:Fengsel er bra for skolen。我的问题是，因为如果我不执行下一个 if 语句(如果执行了之前的 if 语句)，我就使用 else，但是如果我去掉 else if 且仅在出现此错误时才具有

content.js:26 Uncaught DOMException: Failed to execute 'replaceChild' on 'Node': The node to be replaced is not a child of this node.
at chrome-extension://jofeghinfepefmgbllmcicjpjdbeenkg/content.js:26:31
(anonymous) @ content.js:26

我的问题是如何解决这个问题并使代码替换节点内所有找到的单词。

Answer 1

它不起作用，因为在 replaceChild 中，第二个参数指定需要替换哪个元素。在第一个 if 语句中，您从 DOM 中删除了 node，因此当您第二次尝试替换它时，它会失败。

就像wOxxOm建议的那样，您可以直接替换它:

if (node.nodeType === 3) {
  node.nodeValue =
    node.nodeValue
      .replace(/skolenes/gi, 'fengselenes')
      .replace(/skolene/gi, 'fengselene')
      .replace(/skolen/gi, 'fengselet')
      .replace(/skoler/gi, 'fengsler')
      .replace(/skole/gi, 'fengsel');
}

或者，如果你坚持更换节点，你可以这样做:

if (node.nodeType === 3) {
  var text = node.nodeValue;
  var replacedText = 
    text.replace(/skolenes/gi, 'fengselenes')
        .replace(/skolene/gi, 'fengselene')
        .replace(/skolen/gi, 'fengselet')
        .replace(/skoler/gi, 'fengsler')
        .replace(/skole/gi, 'fengsel');

  if (replacedText !== text) {
    element.replaceChild(document.createTextNode(replacedText), node);
  }
}