Question

我想从Twitter中的每个<IMG>获取SRC。

let n = document.getElementsByTagName("img");

for(tip of n){
    console.log(tip.src);
}

，它适用于其他页面，但不适用于Twitter。最终我做到了；

let n = document.getElementsByTagName("img");

function example(){
    for(tip of n){
        if(tip.src == "https://abs-0.twimg.com/emoji/v2/svg/1f1ea-1f1f8.svg"){
            tip.src = "https://abs-0.twimg.com/emoji/v2/svg/1f3f3-fe0f-200d-1f308.svg";
        }
    }
}

setInterval(example, 100);

使用setInterval也可以工作，twitter也可以动态加载内容，因此使用setInterval可以获得所有这些新结果。（不使用setInterval怎么办？）

此外，由于某些奇怪的原因，图片没有变化。它不会更新。

更新：

function example(){
let n = document.getElementsByTagName("div");
    for(tip of n){
        console.log(tip.style['background-image']);

        if(tip.style['background-image'] == 'url("https://abs-0.twimg.com/emoji/v2/svg/1f1ea-1f1f8.svg")'){
            tip.style['background-image']= 'url("https://abs-0.twimg.com/emoji/v2/svg/1f3f3-fe0f-200d-1f308.svg")';
        }
    }
}

setInterval(example, 10000);

现在它可以完美工作了，但是我怎么能在不使用setInterval eeeeeeeeever的情况下获取新数据，而仅在必要时调用该函数呢？

Answer 1

每次迭代时都必须加载图像，以获取“新鲜”的img元素

尝试一下

function example(){
    let n = document.getElementsByTagName("img");  // Moved here
    for(tip of n){
        if(tip.src == "https://abs-0.twimg.com/emoji/v2/svg/1f1ea-1f1f8.svg"){
            tip.src = "https://abs-0.twimg.com/emoji/v2/svg/1f3f3-fe0f-200d-1f308.svg";
        }
    }
}

setInterval(example, 100);

Answer 2

并非总是用img标签显示图像。

如果您在Twitter上看到某些情况，则img标签的同级元素是样式为img src的元素。该元素正在显示图像。显然，Twitter上的每张图片都不是这种情况。

但是在这种情况下，您可以通过以下方式更改背景

let n = document.getElementsByTagName("img");

for(tip of n){
    r.previousSibling.style.backgroundImage='YourImage.png'
}

此外，您还必须使用某种间隔来获取稍后加载的结果。或者，您可以使用Mutation Observer检测DOM更改，而仅在DOM更改时触发函数。

JS如何获取所有img src标签

2 个答案: