Làm hình ảnh w/display: không có yêu cầu HTTP nào?

Question

Trong stylesheet:

#sj {display: none} 

Trong HTML:

<img id="sj" src="scarlett-johansson.jpg" width="640" height="360" alt="scarlett johansson" /> 

Có một yêu cầu HTTP cho hình ảnh xảy ra hay không?

Answer 1

Có, chúng vẫn gây ra yêu cầu HTTP. Ví dụ: http://jsfiddle.net/RzFG2/

Answer 2

Có, yêu cầu vẫn hết nhưng hình ảnh không được hiển thị.

Answer 3

Có cách ngăn chặn yêu cầu HTTP khi sử dụng display:none. Bạn cần tạo hình ảnh background-image trong CSS và đặt phần tử gốc thành display:none.

HTML:

<div id="test3"> 
    <div></div> 
</div> 

CSS:

#test3 div { 
    background-image:url('images/test3.png'); 
    width:200px; 
    height:75px; 
} 
@media all and (max-width: 600px) { 
    #test3 { 
     display:none; 
    } 
} 

Đây là một link nơi bạn có thể đọc về tất cả các loại bài kiểm tra về vấn đề này.

Answer 4

Bạn có thể kiểm tra nếu có một yêu cầu trong trình duyệt console ctrlthay đổi + J và trong Mạng phần bộ lọc Img yếu tố và xem họ được nạp khi làm mới.

Vâng, đây là cách bạn có thể kiểm tra nó nhưng tôi ở đây vì lý do đó tôi đã để lười biếng để kiểm tra điều này bằng cách bản thân mình và nó đã nhanh hơn để tìm kiếm nó trên stackoverflow :)