Question

我想将图像设置为空。通过src=""许多人说它会给浏览器带来问题：

http://www.nczonline.net/blog/2009/11/30/empty-image-src-can-destroy-your-site/

所以我不确定下面是否会遇到与将src设置为空相同的问题：

<img id="myImage">

因为在这种情况下没有src属性。

所以如果我想最初将图像设置为空，我能做的最好的是什么？

Answer 1

最佳解决方案

按如下方式初始化图片：src="//:0"，例如here：<img id="myImage" src="//:0">

编辑 ：根据以下Alex的评论，使用//:0显然可以触发onError img事件1}}。所以要小心这一点。

编辑2 ：来自Drkawashima的评论：从Chrome 61开始src="//:0"似乎不再触发onError事件< / em>的

其他解决方案

或者，您可以使用非常小的图片，直到您实际填充src标记：like this image。使用这个“非常小的图像”，您可以像这样初始化标记：

<img src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs%3D" width="0" height="0" alt="" />

source

从DOM中删除元素

或者，如果您只是不希望元素出现在DOM中，只需使用一些JavaScript：

var myObject = document.getElementById('myObject'); myObject.parentNode.removeChild(myObject);

_{（根据this answer，由于DOM 4中的浏览器支持不佳，建议不要使用JavaScript的.remove()函数。）}

或者只是使用一些jQuery：

$("#myObject").remove();

Answer 2

我所知道的最常被接受的方式（由CSSTricks等推荐）是b中的1px图像

<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"> alt="">

它将作为0B网络请求显示在devtools中，因此如果您正在进行性能监视，您可能会对图像请求的数量感到惊讶。但除此之外没什么值得担心的。

注意：始终包含空alt，否则屏幕阅读器会大声读取img网址。

Answer 3

只需使用哈希符号#即可。它是src属性的有效值。 :) https://stackoverflow.com/a/28077004/3841049

Answer 4

如果src为空或空白

，请使用此脚本设置默认图像

$(document).ready(function () {
   $('img').each(function () {
       if($(this).attr('src')=="") {
          $(this).attr('src', 'Images/download.jpg');
       }
   });
});

将图像src设置为空

4 个答案:

最佳解决方案