Javascript 什么';是什么导致我使用脚本时发生此错误?

Javascript 什么';是什么导致我使用脚本时发生此错误?,javascript,html,google-chrome,google-chrome-devtools,mutation-observers,Javascript,Html,Google Chrome,Google Chrome Devtools,Mutation Observers,原始问题已得到回答。此外,Stackoverflow之外的人已经为我试图通过脚本实现的目标提供了完整的解决方案,我已经添加了脚本作为我问题的答案。脚本本身和它解决的具体问题的摘要在我自己的回答中有详细说明 原始问题: 不幸的是,我不是程序员,所以我的经验非常有限 我的浏览器在启动几秒钟后用不正确的src覆盖正确的imgsrc 我的脚本的预期功能是在浏览器覆盖正确的src时,立即用正确的src替换损坏的src function getElementsBySrc(srcValue) { var

原始问题已得到回答。此外,Stackoverflow之外的人已经为我试图通过脚本实现的目标提供了完整的解决方案,我已经添加了脚本作为我问题的答案。脚本本身和它解决的具体问题的摘要在我自己的回答中有详细说明

原始问题:

不幸的是,我不是程序员,所以我的经验非常有限

我的浏览器在启动几秒钟后用不正确的
src
覆盖正确的
img
src

我的脚本的预期功能是在浏览器覆盖正确的
src
时,立即用正确的
src
替换损坏的
src

function getElementsBySrc(srcValue) {
  var nodes = [];
  var e = document.getElementsByTagName('img');

  for (var i = 0; i < e.length; i++) {
    if (e[i].hasAttribute('src') && e[i].getAttribute('src') == srcValue) {
      nodes.push(e[i]);
    }
  }

  return nodes;
}

function initMod(){
    if(!document.querySelector("#browser")){
        setTimeout(initMod, 1000);
        return;
    }

var targetNode = document.getElementsByTagName('img');
var config = { attributes: true, childList: false, subtree: false, characterData: false };

var callback = function(mutationsList, observer) {
    for(var mutation of mutationsList) {
        if (mutation.type == 'attributes') {

            console.log('The ' + mutation.attributeName + ' attribute was modified.');

            var n = getElementsBySrc('https://hyperspace.marquiskurt.net/icons/favicon-32x32.png');
            for (var i = 0; i < n.length; i++) {
                n[i].setAttribute('src', 'chrome://favicon/https://hyperspace.marquiskurt.net/app/');
            }

        }
    }
};

var observer = new MutationObserver(callback);

observer.observe(targetNode, config);

}
initMod();
函数getElementsBySrc(srcValue){ var节点=[]; var e=document.getElementsByTagName('img'); 对于(变量i=0;i 在浏览器启动时直接加载脚本。我的Chrome Devtools控制台显示错误:


Uncaught TypeError:未能在“MutationObserver”上执行“observe”:参数1不是“Node”类型。
作为
document.getElementsByTagName('img')
返回元素列表,而不是节点,不能使用
targetNode
(因为它不是节点)

这里我使用的是
document.querySelectorAll
,结果是一样的,但它有一个forEach方法,我用来为每个IMG创建突变观察者

function initMod() {
    if(!document.querySelector("#browser")){
        setTimeout(initMod, 1000);
        return;
    }

    const callback = (mutationsList, observer) => {
        for(let mutation of mutationsList) {
            if (mutation.type == 'attributes') {
                console.log('The ' + mutation.attributeName + ' attribute was modified.');
                const n = getElementsBySrc('https://hyperspace.marquiskurt.net/icons/favicon-32x32.png');
                for (let e of n) {
                    e.setAttribute('src', 'chrome://favicon/https://hyperspace.marquiskurt.net/app/');
                }
            }
        }
    };
    const config = { attributes: true, childList: false, subtree: false, characterData: false };
    document.querySelectorAll('img').forEach(targetNode => {
        const observer = new MutationObserver(callback);
        observer.observe(targetNode, config);
    });
}

有人非常友好地提供了一个解决方案,完全实现了我想做的事情

const selector = "#panels img[src='https://hyperspace.marquiskurt.net/icons/favicon-32x32.png']";
function fixImages() {
    const maybeBadImage = document.querySelector(selector);
    if(maybeBadImage){
        maybeBadImage.src = "chrome://favicon/https://hyperspace.marquiskurt.net/app/";
    }
}
const observer = new MutationObserver(fixImages);
function initMod() {
    if(!document.querySelector(selector)){
        setTimeout(initMod, 0);
        return;
    }
    observer.observe(document.querySelector(selector), { attributes: true });
    fixImages();
}
initMod();

setTimeout
设置为0时,会立即纠正损坏的
src
,用户看不到任何视觉变化。如果其他任何人存在web浏览器Vivaldi错误修改特定用户添加的web面板favicon的
src
的问题,则可以修改此脚本以供使用。

document.getElementsByTagName('img')
不是一个节点,它是一个节点的
HTMLcollection
,运行
observer.observe(targetNode,config);observer.disconnect()
这样可以确保观测者永远不会运行:值得一提的是,
img.getAttribute('src')
并不总是与
img.src
相同-您确定知道哪一个与您的需求相关吗?谢谢。我明白了,这解释了脚本的一些问题。我不是程序员,所以脚本肯定有不止一个错误。是的,我确信我需要
img.getAttribute('src')
而不是
img.src
。脚本在没有突变观察者的情况下工作,但是它依赖于延迟,这并不理想,因为这意味着我将实际看到
src
的视觉变化被破坏,然后再次修复。我想我仍然需要等待一位足够善良的人来告诉我如何解决我脚本中的主要问题。(我还更新了脚本以删除
observer.disconnect()
。谢谢。我测试了脚本。这确实修复了控制台中给出的错误。尽管如此,脚本似乎仍然没有达到预期的效果,因为损坏的src没有被替换。我还将initMod延迟减少到200,并且它似乎仍然无法工作。对此,我有点惊讶。脚本是否可能正在检测img属性中的其他更改,但未能找到设置为
https://hyperspace.marquiskurt.net/icons/favicon-32x32.png
,然后停在那里?控制台日志将帮助您找到发生的情况