【jQuery】关于jQuery中$(function() {});

https://blog.youkuaiyun.com/blue225/article/details/51336595

因为一直以来都是在进行后端开发，而对前端开发则接触得极少，其实是从心里面潜意识下也是对这方面有些抵触了，觉得页面调整是个麻烦事，浪费时间而又没啥成就感，所以也不太愿意花时间在这上面了。

最近因为工作的原因，不得不去接触一些前端页面开发的东东，然后发现其实前端开发也没有那么枯燥难耐，像CSS/jQuery还是挺有意思的，简单的几行脚本就可以让页面变得丰富多彩，下面这里就借此将在使用过程中遇到的一些小疑惑总结整理下吧。

【前言】

我们都知道，在开始jQuery前，需要把jQuery库引入进来，具体来说，就是在head 标签之间加入如下语句（详见：点击打开链接）：

[html]  view plain  copy

1. <head>  
2. <script type="text/javascript" src="jquery.js"></script>  
3. </head>  

【准备】

w3school告诉我们，一般而言，jQuery都会从document ready函数开始（详见：点击打开链接）

$(document).ready(function(){

--- jQuery functions go here ----

});

[html]  view plain  copy

1. <html>  
2. <head>  
3. <script type="text/javascript" src="/jquery/jquery.js"></script>  
4. <script type="text/javascript">  
5. $(document).ready(function(){  
6.   $("button").click(function(){  
7.   $(this).hide();  
8. });  
9. });  
10. </script>  
11. </head>  
12.   
13. <body>  
14. <button type="button">Click me</button>  
15. </body>  
16.   
17. </html>  

【关于$(function() {}); 的疑惑】

不幸的时，鄙人发现：在实际项目中，他们写的jQuery脚本却不是这样，取ready函数而代之的$(function() {}); ，这是为什么呢？这跟document ready函数有啥区别呢？

[html]  view plain  copy

1. <!DOCTYPE HTML>  
2. <html>  
3.     <head>  
4.         <meta http-equiv="X-UA-Compatible" content="IE=edge">  
5.         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
6.         <meta http-equiv="Pragma" content="No-Cache">  
7.         <link rel=stylesheet type=text/css href="css/page5.css">  
8.         <script type="text/javascript" src="js/jquery-1.9.0.js"></script>  
9.         <script type="text/javascript">  
10.             $(function() {  
11.                   
12.                 $('.workspace').hover(function() {  
13.                     $('.top_banner > .menu').fadeIn('normal');  
14.                 }, function() {  
15.                     $('.top_banner > .menu').stop().fadeOut('slow');  
16.                 });  
17.             });  
18.               
19.         </script>  
20.     </head>  
21.     <body>  
22.         ....  
23.     </body>  
24. </html>  

【解惑】

原来 $(function(){…}); 也可以写作 jQuery(function($) {…}); ， 其实就是$(document).ready(funcrtion{...}); 的简写。（详见：点击打开链接）