不可小视的图片空路径
西风瘦马 发布于 三月 28, 2010 
评论(0)
评论(0) 什么是图片“空路径”
空路径（empty image src）就是创建一个不指定资源地址的DOM元素，最常见的是img标签，当src为空时，这时就说该图片是空路径。
什么情况下会出现空路径
有两种情况会产生空路径元素：
- 直接在HTML中的明文img标签，src为空。最常见的一个场景是，图片地址是保存在数据库中，当用服务器端语言从数据库中查询并输出，遇到数据库中图片地址字段为空。
HTML:
-
<img src="">
-
- 使用Javascript动态创建的Image，创建后的Image对象的src赋空值。
JAVASCRIPT:
-
var img = new Image();
-
img.src = "";
-
哪些标签可能导致空路径
- <img src="">
- <iframe src="">
- <script src="">
- <input type="image" src="">
- <embed src="">
- <object data="">
空路径有什么危害
危害有两点：
-
增加页面的请求数。
即使是空图片，浏览器也会发起一个http连接，不同浏览器对不同的空路径元素表现不一样，下表列出了各浏览器遇上空路径元素时发起的请求数。
图片=1 图片=2 图片>2 iframe css js image-input embed/object IE6 1 1 1 0 0 0 1 0 FF3.0 1 2 2 0 0 0（报错） 0 0 FF3.5 0 0 0 0 0 0 0 0 Chrome3.0 1 2 2 0 1 1 1 0 Safari4.0 1 2 2 0 1 1 1 0 Opera10.10 0 0 0 0 0 0 0 0 （Chrome,Safari,Opera还会请求/favicon.ico，即使页面没有指定favicon）可以看出IE6，Chrome，Safari，以及3.0以下FireFox都会不同程度的对空路径发起请求。Opera和3.5以上Firefox已经很好的处理了空路径问题。
浏览器对空路径元素请求的目标地址也不一样，IE是请求网页所在的目录，其他浏览器是请求网页本身。例如http://www.sina.com.cn/test/1.php中包含空路径元素，IE发现空路径元素时会请求http://www.sina.com.cn/test/，而其他浏览器是请求http://www.sina.com.cn/test/1.php。
-
成倍增加服务器压力。
从上面的分析可能你已经看出了，浏览器增加的这些请求会定位到网站的其他页面（或者本页）上，这会导致网站服务器对这些本来无谓的请求做出响应，当网站流量很小（PV=100）时，也许增加的这些额外请求算不上什么，但如果网站流量很大，像新浪首页这种日PV上亿级的网页，这些额外的流量将是致命的，说它们会导致服务器瘫痪那绝不是危言耸听。