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实现原理的更多相关文章

  1. 【JS】怎样用原生JS实现jQuery的ready方法

    Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,只是与window.onload方法还是有差别的. 总的来说,window. ...

  2. jquery的ready方法(DOM是否加载完)详解与使用

    jquery的ready方法(准备DOM触发)还是比较复杂的,我们先看流程图:

  3. 绑定弹窗事件最好的方法,原生JS和JQuery方法

    使用jQuery ui = { $close: $('.close') , $pop: $('.pop') , $topopBtn: $('.topop-btn') , $popbtnArea: $( ...

  4. jQuery的ready方法实现原理分析

    jQuery中的ready方法实现了当页面加载完成后才执行的效果,但他并不是window.onload或者doucment.onload的封装,而是使用 标准W3C浏览器DOM隐藏api和IE浏览器缺 ...

  5. Jquery的Ready方法加载为什么两次?

    Ready方法会调用两次? 查看对应的页面是否存在<iframe src="#" --> 存在iframe加载这个页面的时候,页面就会加载两次. $(document) ...

  6. 生JS实现jQuery的ready方法呢?下面是其中之一的做法:

    function ready(fn){ if(document.addEventListener){      //标准浏览器 document.addEventListener('DOMConten ...

  7. HTML DOM对象的属性和方法介绍(原生JS方法)

    HTML DOM对象的属性和方法介绍 DOM 是 Document Object Model(文档对象模型)的缩写. DOM(文档对象模型)是针对HTML和XML文档的一个API(应用程序编程接口), ...

  8. jQuery 事件 - ready() 方法

    转载:http://www.w3school.com.cn/jquery/jquery_hide_show.asp 实例 在文档加载后激活函数: $(document).ready(function( ...

  9. Jquery揭秘系列:ajax原生js实现

    讲到ajax这个东西,我们要知道两个对象XMLHTTPRequest和ActiveXObject ,提供了对 HTTP 协议的完全的访问,包括做出 POST 和 HEAD 请求以及普通的 GET 请求 ...

随机推荐

  1. 【HDU - 1029】Ignatius and the Princess IV (水题)

    Ignatius and the Princess IV  先搬中文 Descriptions:   给你n个数字,你需要找出出现至少(n+1)/2次的数字 现在需要你找出这个数字是多少? Input ...

  2. 使用font-weight无法调节字体粗细的问题解决

    最近我遇到这样的问题,就是使用font-weight无法调节字体粗细. 据我所知,font-weight是用于调节字体粗细的,可选100.200.300.400(normal).500.600.700 ...

  3. web自动化之三大等待

    这个假期有些长,长到忘记了要学习,要找工作,好吧,在我每天无休止的追着偶像剧时,我确实没有负罪感,在听了小祥大佬的分享后,我连睡午觉都被吓醒.大佬跟我同一个班,在大厂工作,每天还抽时间学习,作业也没落 ...

  4. 浅谈Javascript中的原型、原型链、继承

    构造函数,原型,实例三者的关系 构造函数: 构造函数是创建对象的一种常用方式, 其他创建对象的方式还包括工厂模式, 原型模式, 对象字面量等.我们来看一个简单的构造函数: function Produ ...

  5. Redis常用命令之操作String类型

    场景 Centos中Redis的下载编译与安装(超详细): https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/103967334 Re ...

  6. ubuntu 安装mysql数据库

    apt方式安装 官网参考: https://dev.mysql.com/doc/mysql-apt-repo-quick-guide/en/ 执行命令: sudo wget https://dev.m ...

  7. python_函数笔记

    第二章 函数编程 定义: 函数是指将一组语句的集合通过一个名字(函数名)封装起来,要想执行这个函数,只需调用其函数名即可 特性: 减少重复代码 使程序变的可扩展 使程序变得易维护 形参变量 只有在被调 ...

  8. Document节点

    概述 document节点对象代表整个文档,每张网页都有自己的document对象.window.document属性就指向这个对象.只要浏览器开始载入 HTML 文档,该对象就存在了,可以直接使用. ...

  9. redis深入学习

    Redis持久化 官方文档: https://redis.io/topics/persistence 1.RDB和AOF优缺点 RDB: 可以在指定的时间间隔内生成数据集的时间点快照,把当前内存里的状 ...

  10. Linux 文件(持续更新)

    一.文件类型 Linux操作系统把所有内容(文件.图片.视频.设备)都当作文件看待.处理,即一切皆文件. Linux系统把所有文件分为七种类型: 文件类型 文件类型标识 说明 使用ls -l命令查看文 ...