标签:style http io os ar 使用 java sp strong
今天看到别人写的一段关于屏幕横向滚动的jquery代码发现了他用(function($){...})(jQuery)这样写的,作为初学者我们通常最习惯于用$(function(){ });这种样式,于是我查了一下看看其他搬砖的是这样解释道的,很详细很好理解于是记录如下:
当你第一眼看到“(function($){...})(jQuery)”的时候,你有什么感觉?呵呵呵,我当时还是止不住的从心底里骂了一句——操,这 他妈什么劳什子。时过境迁,对于现在无比倚重Jquery的我,自感当时的自己是那么的无知,今天忙里偷闲,解释一下究竟“(function($) {...})(jQuery)”该怎样理解:
代码一:
1
2
3
4
5
6
7
8
9
10
11
12
|
<title>代码一</title> <meta http-equiv= "Content-Type" content= "text/html; charset=UTF-8" > <script type= "text/javascript" > (function(name){ alert(name); })( "GaoHuanjie" ); </script> |
说明:在浏览器中运行上面代码,会弹出一个对话框,对话框的内容为GaoHuanjie。
上面代码中执行的JavaScript脚本和“(function($){...})(jQuery)”是一样的,也就是说“(function($) {...})(jQuery)”中的函数会自动被执行,那么究竟该怎样理解“(function($){...})(jQuery)” 呢?“(function($){...})(jQuery)”实际上表示的是已处于调用状态的匿名函数:function($){...}是定义的匿名 函数,参数为$(之所以将参数声明为$是为了不与其他库冲突);为了调用该函数则在该匿名函数的后面添上了括号和实参(这里为jQuery),但又由于操 作符的优先级,函数本身也需要用括号,所以又为匿名函数添加了括号。一、我运行下面代码为什么报错——jQuery is not defined:
1
2
3
4
5
6
7
8
9
10
11
12
|
<title>代码二</title> <meta http-equiv= "Content-Type" content= "text/html; charset=UTF-8" > <script type= "text/javascript" > (function($){ alert($); })(jQuery); </script> |
1
2
3
4
5
6
7
8
9
10
11
12
13
|
<title>代码三</title> <script type= "text/javascript" src= "./jquery-1.6.2.js" ></script> <meta http-equiv= "Content-Type" content= "text/html; charset=UTF-8" > <script type= "text/javascript" > (function($){ alert($); })(jQuery); </script> |
在引入jQuery库后之所以不会出错是因为jQuery库中定义了jQuery变量。
二、和$(function(){ })相比,(function($){...})(jQuery)的执行时机也是在网页DOM加载完毕后才执行吗?
不是的,比如如下例子:
1
2
3
4
5
6
7
8
9
10
11
12
|
<title>代码四</title> <meta http-equiv= "Content-Type" content= "text/html; charset=UTF-8" > <script type= "text/javascript" > (function(){ alert(document.getElementById( "name" ).value); })(); </script> <input id= "name" name= "name" value= "GaoHuanjie" type= "hidden" > |
1
2
3
4
5
6
7
8
9
10
11
12
13
|
<html> <title>代码五</title> <meta http-equiv= "Content-Type" content= "text/html; charset=UTF-8" > <input id= "name" name= "name" value= "GaoHuanjie" type= "hidden" > <script type= "text/javascript" > (function(){ alert(document.getElementById( "name" ).value); })(); </script> |
一句话:“$(function(){ });”用于存放操作DOM对象的代码,执行其中代码时DOM对象已存在;“(function(){})(jQuery);”用于存放开发插件的代码,执行其中代码时DOM不一定存在。
Jquery中的(function($){...})(jQuery)
标签:style http io os ar 使用 java sp strong
原文地址:http://www.cnblogs.com/dylanblog/p/4056097.html