$(function() {});是$(document).ready(function(){ })的简写，最早接触的时候也说$(document).ready(function(){ })这个函数是用来取代页面中的window.onload;但是今天发现 好像不是这样回事！是在做一个页面载入效果时发现的！

$(document).ready() 里的代码是在页面内容都加载完才执行的，如果把代码直接写到script标签里，当页面加载完这个script标签就会执行里边的代码了，此时如果你标签里执行的代码调用了当前还没加载过来的代码或者dom，那么就会报错，当然如果你把script标签放到页面最后面那么就没问题了，此时和ready效果一样。

$(document).ready(function(){})可以简写成$(function(){});

点击段落后，此段落隐藏：

<html>

<head>

<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function(){

 $("p").click(function(){

  $(this).hide();

 });

});

</script>

</head>

<body>

 <p>If you click on me, I will disappear.</p>

</body>

</html>

　　

如果把$(document).ready(function() {});去掉后，无法隐藏段落：

<html>

<head>

<script type="text/javascript" src="jquery.js"></script>

<script type="text/javascript">

 $("p").click(function(){

  $(this).hide();

 });

</script>

</head>

<body>

 <p>If you click on me, I will disappear.</p>

</body>

</html>

　　

但是把script放到页面最后的话，就可恢复隐藏效果：

<html>

<head>

</head>

<body>

 <p>If you click on me, I will disappear.</p>

</body>

<script type="text/javascript" src="jquery-1.7.2.min.js"></script>

<script type="text/javascript">

 $("p").click(function(){

   $(this).hide();

 });

</script>

</html>

　　

总结：

$(document).ready 里的代码是在页面内容都加载完才执行的，你直接写到script标签里，当页面加载完这个script标签就会执行里边的代码了，如果你标签里执行的代码调用了当前还没加载过来的代码或者dom，那么就会报错，
当然如果你把script标签当到页面最后面那么就没问题了和ready差不多的效果

jQuery中$(function() {});问题详解的更多相关文章

  1. jQuery Validate验证框架详解

    转自:http://www.cnblogs.com/linjiqin/p/3431835.html jQuery校验官网地址:http://bassistance.de/jquery-plugins/ ...

  2. 触碰jQuery：AJAX异步详解

    触碰jQuery:AJAX异步详解 传送门:异步编程系列目录…… 示例源码:触碰jQuery:AJAX异步详解.rar AJAX 全称 Asynchronous JavaScript and XML( ...

  3. jQuery调用AJAX异步详解[转]

    AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1)   使用CSS和X ...

  4. jQuery的deferred对象详解（一）

    最近一段时间,都在研究jquery里面的$.Deffered对象,几天都搞不明白,其中源码的运行机制,网上查找了相关的资料,<jQuery的deferred对象详解>阮一峰老师的文章,里面 ...

  5. 触碰jQuery：AJAX异步详解（转）

    AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1)   使用CSS和X ...

  6. 【转】jQuery Validate验证框架详解

    jQuery校验官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation 一.导入js库 <script type=& ...

  7. jQuery form插件使用详解

    点击打开: jquery选择器全解 jquery中的style样式操作 jquery中的DOM操作 jquery中的事件操作全解 jquery中的动画操作全解 jquery中ajax的应用 自定义jq ...

  8. [转] jQuery的deferred对象详解

    jQuery的开发速度很快,几乎每半年一个大版本,每两个月一个小版本. 每个版本都会引入一些新功能.今天我想介绍的,就是从jQuery 1.5.0版本开始引入的一个新功能----deferred对象. ...

  9. jQuery的deferred对象详解（转）

    jQuery的开发速度很快,几乎每半年一个大版本,每两个月一个小版本. 每个版本都会引入一些新功能.今天我想介绍的,就是从jQuery 1.5.0版本开始引入的一个新功能----deferred对象. ...

随机推荐

  1. Python进阶04 函数的参数对应

    作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! 我们已经接触过函数(function)的参数(arguments)传递.当时我们根 ...

  2. SyntaxError: Non-UTF-8 code starting with '\xba' in file 错误的解决方法！！

    第一次在Eclipse建立python工程,添加了自己新建的文件,写了一点代码,随后执行时候出现了错误,和昨天我在Visual Studio 2015里面一样,错误: SyntaxError: Non ...

  3. bootstrap-下拉菜单

    <!-- 1.给父级添加class为dropdown,或者给父级添加定位属性 2.给button添加data-toggle="dropdown"属性,并添加dropdown- ...

  4. ubuntu 配置TFTP和NFS

    1.安装软件包 sudo apt-get install tftpd tftp xinetd 2.建立配置文件 在/etc/xinetd.d/下建立一个配置文件tftp sudo vi /etc/xi ...

  5. GridControl 继承写法修改自己的GridControl

    namespace GridControlDemo { class MyGridControl : GridControl { protected override BaseView CreateDe ...

  6. EDS 14.0 dtc:commmand not found

    EDS 14.0在生成dtb文件时,输入命令: dtc -I dts -O dtb -o soc_system.dtb soc_system.dts 出现错误: bash:dtc:command on ...

  7. Hibernate三种状态的区分，以及save,update,saveOrUpdate,merge等的使用 引自http://www.blogjava.net/TiGERTiAN/archive/2008/10/25/236519.html

    Hibernate的对象有3种状态,分别为:瞬时态(Transient). 持久态(Persistent).脱管态(Detached).处于持久态的对象也称为PO(Persistence Object ...

  8. X230上安装Yosemite/Win7-黑苹果之路

    以前曾经在X230上安装了mavericks,但因为无线网卡问题最终作罢,现在换了SSD(128G).AR9285网卡,又冲刺了一把OSX,折腾了好几天,终于成了.特做记录如下: 首先,硬盘分区问题, ...

  9. 将 node.js 的数据保存到 mongo 数据库中

    Mongo 数据库 安装 首先到 Mongo 的官方网站下载安装程序:http://www.mongodb.org/,我下载的文件名为:mongodb-win32-x86_64-2008plus-2. ...

  10. 关于lambda表达式在javascript中的使用

    了解过js函数的同学应该都知道js的函数有很多种创建方式. 如: function fun(){}: var fun=function(){}: 但最近的学习中发现了lambda表达式型的创建js的匿 ...