【转载】jquery的$(function(){})和$(document).ready(function(){}) 的区别

https://www.cnblogs.com/yddzyy/p/5180924.html
http://www.jb51.net/article/50967.htm 
https://www.cnblogs.com/wisdo/p/5074419.html 
 
document.ready和onload的区别——JavaScript文档加载完成事件
页面加载完成有两种事件
一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件)
二是onload,指示页面包含图片等文件在内的所有元素都加载完成。
 
用jQ的人很多人都是这么开始写脚本的:
$(function(){
// do something
});
其实这个就是jq ready()的简写,他等价于:

$(document).ready(function(){

//do something
})
//或者下面这个方法,jQuer的默认参数是:“document”;

$().ready(function(){

//do something
})
这个就是jq ready()的方法就是Dom Ready,他的作用或者意义就是:在DOM加载完成后就可以可以对DOM进行操作。
一般情况先一个页面响应加载的顺序是:域名解析-加载html-加载js和css-加载图片等其他信息。
那么Dom Ready应该在“加载js和css”和“加载图片等其他信息”之间,就可以操作Dom了。
 
当然,如果两种方式都有的话:
$(document).ready(function(){ $("#titleDiv").load("content.do?type=list"); })
$(function(){ $("#titleDiv").load("content.do?type=list"); });

那么$(document).ready(function(){})

先被执行,而:$(function(){})后被执行。

 

$(function(){.....})();和和(function (){…} ());表示函数立即执行

 

1. $(function(){ }) 或 jQuery(function(){ })

   此函数也可以写成 jQuery(function(){ }), 用于存放操作DOM对象的代码,执行其中代码时DOM对象已存在。不可用于存放开发插件的代码,因为jQuery对象没有得到传递,外部通过jQuery.method也调用不了其中的方法(函数)。

 

2. (function(){})() 或  function(){ })(jQuery)

   此函数也可以写成   function(){ })(jQuery);其实际上是执行()(para)匿名方法,只不过是传递了jQuery对象。用于存放开发插件的代码,执行其中代码时DOM不一定存在,所以若要直接自动执行DOM操作的代码请小心使用。它相当于:

function wido($){} ;  wisdo(jQuery), 是初始化jquery对象的惯用方法.

3. (function($){...})() 或 (function($){...})(jQuery)

  实际上是匿名函数,它等效于匿名函数 function(arg){...} ,参数为 arg,是初始化jquery对象的惯用方法,有的时候会使页面跳动, 在调用函数时,是在函数后面写上括号和实参的,由于操作符的优先级,函数本身也需要用括号,即: (function(arg){...})(param),这就相当于定义了一个参数为arg的匿名函数,并且将param作为参数来调用这个匿名函数,而(function($){...})(jQuery)则是一样的,之所以只在形参使用$,是为了不与其他库冲突,所以实参用jQuery,

例如:

(funtion(str){alert(str)})("output"));相当于:funtion OutPutFun(str){alert(str);};OutPutFun("output");

posted @ 2017-11-09 16:11  事理  阅读(8508)  评论(1编辑  收藏  举报