$(document).ready(){}、$(fucntion(){})、(function(){})(jQuery)onload()的区别
1.首先说JQuery的几个写法
$(function(){
//do someting
});
$(document).ready(function(){
//do someting
});
$().ready(function(){
//do someting
})
这三种方法都是JQuery的方法,写法不一样,但是效果一样。
2.这三个写法和$(window).load(function(){...})、onload()的区别
2.1.加载多个函数的问题
<body onload="a();b();">
</body>
在Onload事件中只能这样加载,很丑陋…而在JQuery中你可以利用多个JQuery.Ready()方法,它们会按次序依次执行
2.2代码和内容不分离
这个貌似不用说了,让人深恶痛绝-.-!!
3.3执行先后顺序不同
对于Body.Onload事件,是在加载完所有页面内容才会触发,我的意思是所有内容,包括图片,flash等.如果页面的这些内容很多会让用户等待很长时间.
而对于$(document).ready()方法,这个方法只是在页面所有的DOM加载完毕后就会触发,无疑很大的加快了网页的速度.
但是对于一些特殊应用,比如图片的放大缩小,图片的剪裁。需要网页所有的内容加载完毕后才执行的呢?我推荐使用$(window).load()方法,这个方法会等
到页面所有内容加载完毕后才会触发,并且同时又没有OnLoad事件的弊端.
3.(function($){})(jQuery)
(function() {
alert("hi");//不一定在dom加载完执行,所以要操作dom对象时需要注意
})(jQuery)
3.1首先(function(){})()这种写法 是创建了一个匿名的方法并立即执行(function(){})这个是匿名方法后面的括号就是立即调用了这个方法)。这样做可以创建一个作用域以保证内部变量与外部变量不发生冲突,比如$ jQuery 等jquery内部定义的变量。
3.2 (function($){})(jQuery) 这个写法主要的作用还是保证jquery不与其他类库或变量有冲突 首先是要保证jQuery这个变量名与外部没有冲突(jquery内部$与jQuery是同一个东西 有两个名字的原因就是怕$与其他变量名有冲突二jQuery与其他变量冲突的几率非常小)并传入匿名对象,匿名对象给参数起名叫做$(其实和jquery内部是一样的) 然后你就可以自由的在(function($){})(jQuery)里写你的插件而不需要考虑与外界变量是否存在冲突。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<script type="text/javascript" src="jquery-1.7.2.min.js" charset="utf-8" ></script>
</HEAD>
<BODY onload="alert('onload')">
<script type="text/javascript" charset="utf-8" > $(function(){
alert("$(function()");
});
$(document).ready(function(){
alert("$(document).ready");
});
$().ready(function(){
alert("$().ready(function()");
})
//上面三个方法是级别是一样的,按代码的先后顺利执行,是在dom对象加载完 $(window).load(function() {
alert("$(window).load(function()");//是在图片,flash等加载完执行
}); (function() {
alert("hi");//不一定在dom加载完执行,所以要操作dom对象时需要注意
})(jQuery) //弹出先后顺利是:hi-> $(function() -> $(document).ready -> $().ready(function() -> onload -> $(window).load(function()
</script> </BODY>
</HTML>
<转载自:http://www.cnblogs.com/allensoft/archive/2014/04/10/3656202.html>
随机推荐
- Chrome编辑了样式或者JS之后自动同步回本地工程
比如我用HBuilder进行调试,在Chrome上修改了几个样式,我们通常的做法是,拷贝修改后的地方,然后再进行覆盖. 现在有了全自动的操作,在Chrome上修改了样式之后,通过Sources的Sav ...
- Python基础0:变量 赋值 表达式和运算符
变量: 前面我们在使用print()输出内容的时候,如果内容很长,后面要再次输出的时候,就需重新在输入一遍. 如果给输出的内容起个简单的别名.这样我们用简短的别名来代替长内容,下次要输出的时候就直接使 ...
- dedecms /member/pm.php SQL Injection Vul
catalog . 漏洞描述 . 漏洞触发条件 . 漏洞影响范围 . 漏洞代码分析 . 防御方法 . 攻防思考 1. 漏洞描述 Dedecms会员中心注入漏洞 Relevant Link http:/ ...
- Process
--- - hosts: test gather_facts: false tasks: - name: Task1 shell: ls notify: Hander3 - name: Task2 s ...
- [JavaWeb 用MyEclipse分别创建最简单的JSP程序和Servlet程序]
最近看了子柳的<淘宝技术这十年>,其中讲到因为负载和连接池问题,淘宝当年迫不得已从SUN请来一对工程师从LAMP架构转到Java+Oracle.作为一个PHP为“母语”的程序仔,真是感到压 ...
- [Android]Volley源码分析(一)
一. 如何使用Volley? 1. 首先定义一个RequestManager类,用来在Android程序启动时对Volley进行初始化.RequestManager为单例类,因为只有在程序启动时调用, ...
- POJ1050To the Max(求最大子矩阵)
题目链接 题意:给出N*N的矩阵,求一个子矩阵使得子矩阵中元素和最大 分析: 必备知识:求一组数的最大连续和 int a[N]; ,maxn = -INF; ; i <= n; i++) { i ...
- python 模拟登陆,请求包含cookie信息
需求: 1.通过GET方法,访问URL地址一,传入cookie参数 2.根据地址一返回的uuid,通过POST方法,传入cooki参数 实现思路: 1.理解http的GET和POST差别 (网上有很多 ...
- CSS-论css如何纯代码实现内凹圆角
background-image: radial-gradient(200px at 50px 0px, #fff 50px, #4169E1 50px); 这是做内凹圆角的核心代码,就是背景图的ra ...
- CSS3-box-flex弹性盒布局
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...