jQuery里ready方法用原生js实现原理
function ready(fn){
if(document.addEventListener){
//标准浏览器
document.addEventListener('DOMContentLoaded',function(){
//注销事件,避免反复触发
document.removeEventListener('DOMContentLoaded',arguments.callee,false);
//执行函数
fn();
},false);
}else if(document.attachEvent){
//IE浏览器
document.attachEvent('onreadystatechange',function(){
if(document.readyState=='complete'){
document.detachEvent('onreadystatechange',arguments.callee);
//执行函数
fn();
}
});
}
}
亲测有效!
jQuery里ready方法用原生js实现原理的更多相关文章
- 【JS】怎样用原生JS实现jQuery的ready方法
Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,只是与window.onload方法还是有差别的. 总的来说,window. ...
- jquery的ready方法(DOM是否加载完)详解与使用
jquery的ready方法(准备DOM触发)还是比较复杂的,我们先看流程图:
- 绑定弹窗事件最好的方法,原生JS和JQuery方法
使用jQuery ui = { $close: $('.close') , $pop: $('.pop') , $topopBtn: $('.topop-btn') , $popbtnArea: $( ...
- jQuery的ready方法实现原理分析
jQuery中的ready方法实现了当页面加载完成后才执行的效果,但他并不是window.onload或者doucment.onload的封装,而是使用 标准W3C浏览器DOM隐藏api和IE浏览器缺 ...
- Jquery的Ready方法加载为什么两次?
Ready方法会调用两次? 查看对应的页面是否存在<iframe src="#" --> 存在iframe加载这个页面的时候,页面就会加载两次. $(document) ...
- 生JS实现jQuery的ready方法呢?下面是其中之一的做法:
function ready(fn){ if(document.addEventListener){ //标准浏览器 document.addEventListener('DOMConten ...
- HTML DOM对象的属性和方法介绍(原生JS方法)
HTML DOM对象的属性和方法介绍 DOM 是 Document Object Model(文档对象模型)的缩写. DOM(文档对象模型)是针对HTML和XML文档的一个API(应用程序编程接口), ...
- jQuery 事件 - ready() 方法
转载:http://www.w3school.com.cn/jquery/jquery_hide_show.asp 实例 在文档加载后激活函数: $(document).ready(function( ...
- Jquery揭秘系列:ajax原生js实现
讲到ajax这个东西,我们要知道两个对象XMLHTTPRequest和ActiveXObject ,提供了对 HTTP 协议的完全的访问,包括做出 POST 和 HEAD 请求以及普通的 GET 请求 ...
随机推荐
- 基于arduino的气象站
bmp180的简介: • 压力范围:~1100hPa(海拔 米~- 米) • 电源电压:.8V~.6V(VDDA), .62V~.6V(VDDD) • 尺寸:.6mmx3.8x0.93mm • 低功耗 ...
- 吴裕雄--天生自然轻量级JAVA EE企业应用开发Struts2Sping4Hibernate整合开发学习笔记:Spring_autowire
<?xml version="1.0" encoding="GBK"?> <beans xmlns:xsi="http://www. ...
- 02.JS数据类型与数据类型转换
前言: 学习一门编程语言的基本步骤 (01)了解背景知识 (02)搭建开发环境 (03)语法规范 (04)常量和变量 (05)数据类型 (06)数据类型转换5.数据类型——datatype 数据 ...
- kong服务网关API
kong服务网关API pingforever关注 0.1762017.05.23 11:16:08字数 834阅读 7,367 kong简介 Kong 是在客户端和(微)服务间转发API通信的API ...
- es5和es6创建新数组的方法
//es5 let array = Array(5) let array = [] //es6 1.let array = Array.of(1,2,3,4,5) 2.let array = Arra ...
- 建造者模式(Builder)——从组装电脑开始
建造者模式(Builder)--从组装电脑开始 建造者模式概括起来就是将不同独立的组件按照一定的条件组合起来构成一个相对业务完整的对象.调用者无需知道构造的过程. 我们从组装电脑开始 让我们从买组装电 ...
- js遇到代码出现问题时如何调试代码
单步跟踪调试 debugger; 控制台watch功能查看变量当前值 进入函数操作 随着不断点击,不停进行循环,指定变量的值也在发生改变 添加断点 跳入跳出函数 throw new Error() 主 ...
- C语言程序设计(实验一)
实验项目:1.3.2,1.3.3,1.3.4,2.3.1,2.3.2 姓名:邹琼 实验地点:家 实验时间:2020年2月28日 一.实验目的与要求 1.实验目的 掌握DEVC++的安装方法,并实现 ...
- 安装JumpServer到CentOS(YUM)
运行环境 系统版本:CentOS Linux release 7.6.1810 (Core) 软件版本:JumpServer-1.4.8 硬件要求:最低2核4GB 官方文档:https://docs. ...
- MyBatis的延迟加载和缓存机制
延迟加载: 什么是延迟加载: MyBatis中的延迟加载,也称为懒加载,是指在进行关联查询时,按照设置延迟规则推迟对关联对象的select查询.延迟加载可以有效的减少数据库压力. MyBatis根据对 ...