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


当前回答

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

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

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

其他回答

如果你保持SRC属性为空,浏览器将发送请求到当前页面的url 如果不想要任何url,总是在SRC属性中添加1*1透明img

src="data:image/gif;base64,R0lGODlhAQABAAAAACwAAAAAAQABAAA="

正如评论中所写的,这种方法是错误的。

我没有找到这个答案之前,但根据W3规范有效的空src标签将是一个锚链接#。

示例:src="#", src="#empty"

页面验证成功,没有发出额外的请求。

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

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

虽然没有有效的方法来忽略图像的源,但有一些源不会导致服务器故障。我最近有一个类似的问题与iframes和确定//:0是最好的选择。不,真的!

以//开头(省略协议)导致使用当前页面的协议,防止HTTPS页面中的“不安全内容”警告。没有必要跳过主机名,但可以使其更短。最后,端口为:0确保服务器请求不能发出(根据规范,这不是一个有效的端口)。

这是我发现的唯一一个在任何浏览器中都没有导致服务器命中或错误消息的URL。通常的选择——javascript:void(0)——如果在通过HTTPS提供服务的页面上使用,会在IE7中导致“不安全内容”警告。任何其他端口都会导致尝试服务器连接,即使是无效地址。(一些浏览器会简单地发出无效的请求并等待它们超时。)

这在Chrome, Safari 5, FF 3.6和IE 6/7/8中进行了测试,但我希望它能在任何浏览器中工作,因为它应该是网络层,可以杀死任何尝试的请求。

简单来说,就像这样:

<img id="give_me_src"/>