包含没有src的图像的有效方法是什么?

我有一个图像，我将动态填充src稍后与javascript，但为了方便，我希望图像标签存在于页面加载，但只是不显示任何东西。我知道<img src= " />是无效的，那么最好的方法是什么?

当前回答

根据Ben Blank的回答，我在w3验证器中得到这个验证的唯一方法是这样的:

<img src="/./.:0" alt="">`

其他回答

简单来说，就像这样:

<img id="give_me_src"/>

我建议动态添加元素，如果使用jQuery或其他JavaScript库，它是相当简单的:

http://api.jquery.com/appendTo/ http://api.jquery.com/prependTo/ http://api.jquery.com/html/

再看看prepend和append。否则，如果你有一个这样的图像标签，你想让它有效，那么你可以考虑使用一个虚拟的图像，如1px透明gif或png。

我发现，简单地将src设置为一个空字符串，并在CSS中添加一个规则来隐藏损坏的图像图标就可以了。

[src=''] {
    visibility: hidden;
}

另一种选择是嵌入一个空白图像。任何符合你的目的的图像都可以，但是下面的例子编码了一个只有26字节的GIF——来自http://probablyprogramming.com/2009/03/15/the-tiniest-gif-ever

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

根据下面的评论编辑:

当然，您必须考虑您的浏览器支持需求。不支持IE7或更低版本是值得注意的。http://caniuse.com/datauri

根据本文，使用真正空白、有效且高度兼容的SVG:

src = " +:形象/ svg xml数据;charset = utf8, 3Csvg % 20xmlns = http://www.w3.org/2000/svg’排% 3C / svg %排”

与任何SVG一样，它的默认大小为300x150px，但是您可以在img元素的默认样式中使用它，因为在实际实现中任何情况下都可能需要它。

推荐文章