js实现图片延迟加载原理

<img src="image/1188695.png" alt="taobao" trueImg="image/1.jpg" id="img"/>

js

var img=document.querySelector("#img");
window.setTimeout(function (){
var oImg=document.createElement('img');
oImg.src=img.getAttribute('trueImg');
oImg.onload=function(){
img.src=this.src;
oImg=null;
}
},500);

 

所有的事件绑定都是异步编程

 

js盒子模型：
clientHeight=内容的高度+上下填充;
offsetHeight=clientHeight+上下边框;
clientTop=borderTop;
offsetTop:父级定位元素的上偏移量->margin（自己最外边到border）
scrollHeight:一般都是约数，在不同的浏览器中获取到的结果是不同的

scrollTop:滚动条减去的宽度或者高度

document.documentElement.scrollTop=0;
document.body.scrollTop=0;

 

<a href="javascript:void 0;">跳转页面</a>

取消a标签默认行为

 

<a href="#">跳转页面</a>

 刷新当前页面

 

var timer1=setTimeout(function(){
console.log(11);
},1000);

console.log(timer1);
window.clearTimeout(1);