摘要:原生封装发送异步,同步实现图片懒加载存储图片加载到的位置,避免每次都从第一张图片开始遍历
1.原生JS封装Jsonp
function createScript(src,callback) { let script = document.createElement("script"); script.src = src+"callback"; document.appendChild(script) } function callback(json) { console.log(json) }2.JS发送Ajax
let xhr = new XMLHttpRequest(); xhr.open("GET", "url",false)//false异步,true同步 xhr.onreadystatechange = function () { if (xhr.readyState === 4) { if (xhr.status === 200) { console.log(xhr.responseText) } } } xhr.send(null)3.JS实现图片懒加载
var aImg = document.querySelectorAll("img"); var len = aImg.length; var n = 0;//存储图片加载到的位置,避免每次都从第一张图片开始遍历 window.onscroll = function() { var seeHeight = document.documentElement.clientHeight; var scrollTop = document.body.scrollTop || document.documentElement.scrollTop; for (var i = n; i < len; i++) { if (aImg[i].offsetTop < seeHeight + scrollTop) { if (aImg[i].getAttribute("src") == "") { aImg[i].src = aImg[i].getAttribute("data-src"); } n = i + 1; console.log("n = " + n); } } };
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/89949.html
摘要:面向对象三大特征继承性多态性封装性接口。第五阶段封装一个属于自己的框架框架封装基础事件流冒泡捕获事件对象事件框架选择框架。核心模块和对象全局对象,,,事件驱动,事件发射器加密解密,路径操作,序列化和反序列化文件流操作服务端与客户端。 第一阶段: HTML+CSS:HTML进阶、CSS进阶、div+css布局、HTML+css整站开发、 JavaScript基础:Js基础教程、js内置对...
摘要:面向对象三大特征继承性多态性封装性接口。第五阶段封装一个属于自己的框架框架封装基础事件流冒泡捕获事件对象事件框架选择框架。核心模块和对象全局对象,,,事件驱动,事件发射器加密解密,路径操作,序列化和反序列化文件流操作服务端与客户端。 第一阶段: HTML+CSS:HTML进阶、CSS进阶、div+css布局、HTML+css整站开发、 JavaScript基础:Js基础教程、js内置对...
摘要:实现的四大模块上文简述了源码的大体框架结构,接下来我们来实现一个的框架,笔者认为理解和实现一个框架需要实现四个大模块,分别是封装创建类构造函数构造对象中间件机制和剥洋葱模型的实现错误捕获和错误处理下面我们就逐一分析和实现。 什么是koa框架? koa是一个基于node实现的一个新的web框架,它是由express框架的原班人马打造的。它的特点是优雅、简洁、表达力强、自由度...
摘要:实现的四大模块上文简述了源码的大体框架结构,接下来我们来实现一个的框架,笔者认为理解和实现一个框架需要实现四个大模块,分别是封装创建类构造函数构造对象中间件机制和剥洋葱模型的实现错误捕获和错误处理下面我们就逐一分析和实现。 什么是koa框架? koa是一个基于node实现的一个新的web框架,它是由express框架的原班人马打造的。它的特点是优雅、简洁、表达力强、自由度...
阅读 2236·2021-09-26 09:55
阅读 3561·2021-09-23 11:22
阅读 2135·2019-08-30 15:54
阅读 1844·2019-08-28 18:03
阅读 2519·2019-08-26 12:22
阅读 3404·2019-08-26 12:20
阅读 1663·2019-08-26 11:56
阅读 2225·2019-08-23 15:30