Question

我试图在Internet Explorer上修改这个简单的用户脚本以修改我自己的变量，看起来很简单但是当我用自己的变量替换变量进行搜索和替换时，除非我刷新，否则网站会完全破坏

(function(){

    var arrGoogleInstances = document.body.innerHTML.match(/google/ig);

    if (arrGoogleInstances != null)
    {
        if (arrGoogleInstances.length > 0)
        {
            document.body.innerHTML = document.body.innerHTML.replace(/google/ig,'guuuuuuuugle');
            document.body.innerHTML = document.body.innerHTML.replace(/Google /ig,'Guuuuuuugle');   
        }   
    }

})();

例如，我尝试用数字替换google正则表达式术语。但是，这个剧本似乎并没有起作用，似乎弄乱了我的网站。

谁能告诉我为什么会这样？

Answer 1

不要使用innerHTML！（差不多，永远）
发生的事情是HTML结构本身的某些部分正在被删除，具体取决于您发送给.replace()的值。而且，使页面工作的所有javascript都被破坏或孤立。

正确的方法是使用DOM技术递归页面的文本节点。

代码是这样的，你可以see it in action at jsfiddle：

replaceTextValues (document.body, /Google/ig, "Guuuuuuugle");


//-- Internet explorer doesn't define DOM2 constants!
if (typeof Node != "undefined") {
    TEXT_NODE       = Node.TEXT_NODE;
    ELEMENT_NODE    = Node.ELEMENT_NODE;
}
else {
    TEXT_NODE       = 3;
    ELEMENT_NODE    = 1;
}

function replaceTextValues (node, regex, replaceWith) {
    if (node.nodeType === TEXT_NODE) {
        node.nodeValue  = node.nodeValue.replace (regex, replaceWith);
    }
    else if (node.nodeType === ELEMENT_NODE) {
        for (var K = 0, numNodes = node.childNodes.length;  K < numNodes;  ++K) {
            replaceTextValues (node.childNodes[K], regex, replaceWith);
        }
    }
}

全局替换页面上的文本，打破/哄骗它

1 个答案: