如何使用JavaScript书签隐藏当前网页上的所有图片？

Question

我想创建一个简单的书签工具，可以隐藏我正在浏览网站上的所有图像。

javascript:body.getElementsByTagName("img").style.visibility="hidden";

这不起作用？我想知道我做错了什么？

谢谢你的帮助！

- matt

Answer 1

您需要迭代从document.getElementsByTagName返回的类似数组的对象，例如：

var imgs = document.getElementsByTagName("img");
for (var i = 0; i < imgs.length; i++) {
    imgs[i].style.visibility = "hidden";
}

编辑：

完整的书签脚本URI：

javascript:(function(){var imgs=document.getElementsByTagName("img");for(var i=0;i<imgs.length;i++)imgs[i].style.visibility="hidden"}());

- harto

---

javascript:var%20imgs=document.getElementsByTagName("img");for(var%20i=0;i<imgs.length;i++){imgs[i].style.visibility="hidden";} - matt

谢谢！但它并不能在每个页面上都起作用！例如，在谷歌上浏览图片时，它不会隐藏图片？有什么想法为什么会这样吗？ - matt

当点击书签时，这将适用于所有图像。尽管在您的问题范围内没有指定，但没有任何阻止图像在此之后加载的情况。如果您添加一个“setInterval”以每隔几秒钟重新执行它或插入CSS规则，则可以实现这一点。 - donohoe

这种方法（以及我的方法）无法隐藏未使用<img>标签嵌入的图像。这些主要是基于CSS的图像（background-url等），但也可以是<embed>，因为图像可以使用嵌入标记嵌入。 - Yahel

@mathiregister：至少在使用新的图像搜索功能的Chrome浏览器中，他们正在使用画布元素而不是图像。如果您使用“canvas”而不是“img”调用getElementsByTagName，它应该可以工作。当然，您可能希望两者都做。另一个您可能需要考虑的情况是CSS背景图像。 - Matthew Crumley

Answer 2

我的问题是这些横幅图片占满了整个页面（不感兴趣）。因此我无法阅读任何文本（文本很有意思）。

将高度设置为0或者在这个例子中设置为60像素。

var imgs = document.getElementsByTagName("img");
for (var i = 0; i < imgs.length; i++) {
    imgs[i].style.height = "60px";
}

javascript:(function()%7Bvar%20imgs%20%3D%20document.getElementsByTagName(%22img%22)%3Bfor%20(var%20i%20%3D%200%3B%20i%20%3C%20imgs.length%3B%20i%2B%2B)%20%7Bimgs%5Bi%5D.style.height%20%3D%20%2260px%22%3B%7D%7D)()

- SL5net