每个响应式网站开发教程都建议使用display:noneCSS属性隐藏在移动浏览器上加载的内容,以便网站加载速度更快.这是真的吗?难道display:none不加载图像或它仍然加载在手机浏览器的内容?有没有办法阻止在移动浏览器上加载不必要的内容?
我是javascript的新手.我想知道装载是如何工作的.假设在我的html页面中我有一个可见性被设置为隐藏的图像.我有一个按钮,点击时使用javascript将图像的可见性属性设置为visbile.加载页面时,图像会加载,或者在单击按钮时加载图像.
同样我想知道display值设置为none的display属性.
提前致谢.
这是不是重复的这个,因为它也使用document.ready这显然是行不通的做法.
我想避免浏览器加载<img>嵌套在隐藏<div>元素中的images().
所以我尝试了这个,但是javascript执行得太迟了,浏览器已经开始下载不应该的图像了.
$(document).ready(function() {
$('div').not(":visible").each(function () {
$(this).find('img').each(function() {
$(this).attr("src","");
});
});
});
Run Code Online (Sandbox Code Playgroud)
有一个很好的JavaScript解决方案吗?还是我使用<img srctmp="...."/>,然后替换srctmp由src通过JavaScript对于不嵌套在一个隐藏的这些图片<div>?
当 div 被隐藏 ( display:none) 时,浏览器将不会加载其中的图像。有没有办法告诉浏览器加载图像?我需要图像的高度和宽度来进行一些预处理。
注意:由于一些其他代码,我无法使 div 可见。检查这里的例子。另外,“延迟加载”示例对我来说不起作用。