Chrome 扩展 Javascript 变量问题

Question

我是 js 代码的新手（来自 php/html/css），我正在尝试为 Chrome 创建一个个人扩展，允许浏览器替换一些单词其他！

所以我有我的 manifest.json :

{
  "manifest_version": 2,
  "name": "Name1",
  "version": "14.3",
  "description": "Desc1",
   "browser_action": {
      "default_icon": "myicon.png",
      "popup": "popup.html"
  },
  "content_scripts": [
         {
            "matches": [
                "http://*/*",
                "https://*/*"
            ],
            "js": [
                "content.js"
            ],
            "run_at": "document_end"
        }  ]
}

然后是我的content.js

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(/[wordtoreplace]/gi, '[neword1]');
            var replacedText = text.replace(/[wordtoreplace2]/gi, '[neword1]');
            var replacedText = text.replace(/[wordtoreplace3]/gi, '[neword1]');
            if (replacedText !== text) {
                element.replaceChild(document.createTextNode(replacedText), node);
            }
        }
    }
}

但是浏览器只替换了我的 word1 而不是我的 word2 和 3 :( 武力帮不了，有人帮吗？

Answer 1

错误是同一个变量的重新声明和初始化。如果您声明一个变量并将其初始化为一个值，并且在您重新声明同一个变量并用另一个值初始化后立即，结果将是：

var myVar = "This is the first var";
var myVar = "Second var";
alert(myVar);

现在警报的结果是"Second var"。

重新声明变量在某些高级上下文中很有用，但对普通编程完全没有用。变量一旦声明，就无法重新声明，因为它没有用，并且生成的程序变得不可读。在任何情况下，如果您为每个变量声明初始化值，最后一个将包含实际值。

因此，您的以下三行：

var replacedText = text.replace(/[wordtoreplace]/gi, '[neword1]');
var replacedText = text.replace(/[wordtoreplace2]/gi, '[neword1]');
var replacedText = text.replace(/[wordtoreplace3]/gi, '[neword1]');

必须更改为：

var replacedText = text.replace(/[wordtoreplace]/gi, '[neword1]');
replacedText = replacedText.replace(/[wordtoreplace2]/gi, '[neword1]');
replacedText = replacedText.replace(/[wordtoreplace3]/gi, '[neword1]');

而不是重新声明同一个变量，考虑像下面的例子那样链接方法：

var text = "word1 word2 word3";
var replacedText =text.replace("word1", "1")
        .replace("word2", "2")
        .replace("word3", "3");
alert(replacedText);

现在replacedText的内容是“1 2 3”，因为对字符串应用replace方法意味着得到一个新的字符串，可以立即再次应用replace方法等等。

REPLACE：替换中的标志gi代表：

g: 全局匹配
i: 忽略大小写

Chrome 扩展 Javascript 变量问题

Chrome Extension Javascript var issue

javascript

jquery

google-chrome

var

google-chrome-extension