图片的HTTP请求方法有哪些

这篇文章主要介绍“图片的HTTP请求方法有哪些”,在日常操作中,相信很多人在图片的HTTP请求方法有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”图片的HTTP请求方法有哪些”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!

创新互联 - 成都托管服务器,四川服务器租用,成都服务器租用,四川网通托管,绵阳服务器托管,德阳服务器托管,遂宁服务器托管,绵阳服务器托管,四川云主机,成都云主机,西南云主机,成都托管服务器,西南服务器托管,四川/成都大带宽,大带宽服务器,四川老牌IDC服务商

请在主流浏览器中打开测试页面,在Fiddler里查看http请求。

1. 隐藏图片
测试:test_1.html
结论:只有Opera不产生请求。
注意:用visibility: hidden隐藏图片时,在Opera下也会产生请求。

2. 重复图片
测试:test_2.html
结论:所有浏览器都只产生一次请求 。

3. 重复背景

test1
test2
测试:test_3.html
结论:所有浏览器都只产生一次请求。

4. 不存在的元素的背景

test1
测试:test_4.html
结论:背景仅在应用的元素在页面中存在时,才会产生请求。这对CSS框架来说,很有意义。

5. 隐藏元素的背景

test1
测试:test_5.html
结论:Opera和Firefox对于用display: none隐藏的元素背景,不会产生HTTP请求。仅当这些元素非display: none时,才会请求背景图片。

6. 多重背景

test1
测试:test_6.html
结论:除了基于webkit渲染引擎的Safari和Chrome,其它浏览器只会请求一张背景图。
注意:webkit引擎浏览器对背景图都请求,是因为支持CSS3中的多背景图。

7. hover的背景加载
test1测试:test_7.html
结论:触发hover时,才会请求hover状态下的背景。这会造成闪烁,因此经常放在同一张背景图里通过翻转来实现。
注意:在图片no-cache的情况下,IE每次hover状态改变时,都会产生一次新请求。很糟糕。
2009-05-13晚补充:上面的解释有误,更详细的解释请参考续篇。翻转技巧指的是Sprite技术,例子:test_7b.html, 在ie6下不会产生闪烁。

8. JS里innerHTML中的图片
测试:test_8.html
结论:只有Opera不会马上请求图片。
注意:当添加到DOM树上时,Opera才会发送请求。

9. 图片预加载
最常用的是JS方案:

代码如下:

在无JS支持的环境下,可以采用隐藏元素来预加载:
测试:test_9.html

到此,关于“图片的HTTP请求方法有哪些”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注创新互联网站,小编会继续努力为大家带来更多实用的文章!


本文题目:图片的HTTP请求方法有哪些
地址分享:http://azwzsj.com/article/pjohee.html