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 请求 ...
随机推荐
- RabbitMQ安装(发生系统错误5。拒绝访问。发生系统错误1067。进程意外终止。)
RabbitMQ安装步骤(windows) 1.RabbitMQ建立在强大的Erlang OTP平台上,因此我们首先需要安装Erlang. 2.接下来安装RabbitMQ服务rabbitmq-serv ...
- echarts多条折线图
折线图单只比较好配置,但是多只的话,楼主整整难了一下午才搞出来,下面分享下啦 var myChart = echarts.init(document.getElementById('series-ch ...
- wifite硬核破解WiFi密码
如题 楼主在这里分享下如何使用工具破解附近的WiFi 今天使用的工具是 wifite 现在都有WiFi万能钥匙了 暴力破解还有市场吗? 首先他俩的破解思路就不一样 wifi万能钥匙是根据云端数据库内容 ...
- 二、Nginx配置实例
Nginx配置实例 一.反向代理 实例一 1.实现效果 打开浏览器,在浏览器地址栏输入地址 www.123.com ,跳转到linux系统tomcat主页面中. 2.准备工作 在linux系统中安装t ...
- C#开发OPC客户端
第一个随笔,使用了OPEN Live Write,作为客户端.最近使用c#开发一个小软件,主要功能是OPC客户端.以后会开发各类别的协议,作为,协议的转发栈. 因为我本人是搞自动化的,所以搞自动化小伙 ...
- 安装JumpServer到CentOS(YUM)
运行环境 系统版本:CentOS Linux release 7.6.1810 (Core) 软件版本:JumpServer-1.4.8 硬件要求:最低2核4GB 官方文档:https://docs. ...
- 【笔记】机器学习 - 李宏毅 - 7 - Deep Learning
深度学习发展历史: 感知机和逻辑回归很像,只是没有\(sigmoid\)激活函数. 深度学习训练的三个步骤: Step1:神经网络(Neural network) Step2:模型评估(Goodnes ...
- Mybatis Dao接口与Xml文件不匹配的问题:Invalid bound statement (not found)
<!-- 如果不添加此节点mybatis的mapper.xml文件都会被漏掉. --> <resources> <resource> <directory&g ...
- laravel手动数组分页
laravel文档中已经有写如何自己使用分页类去分页了,但没有详细说明. 如果你想手动创建分页实例并且最终得到一个数组类型的结果,可以根据需求来创建 IlluminatePaginationPagin ...
- Linux中为什么执行自己的程序要在前面加./
前言 在Linux中,我们执行内置命令时,直接输入命令名称即可,如: $ mv a b #将a重命名为b 而在执行自己写好的程序时,却要带上./,例如: $ hello hello: comm ...