$(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. C#异步编程 z

    http://www.cnblogs.com/fangyz/p/5134018.html 从.NET4.5开始,用async和await关键字再加上Task.Run是一个非常不错的异步编程模型. 1. ...

  2. [Flex] ButtonBar系列——如何给ButtonBar添加一个ViewStack

    <?xml version="1.0" encoding="utf-8"?> <!--如何给ButtonBar添加一个ViewStack--& ...

  3. gomobile 真机 log 打出的日志跟踪

    go mobile 开发的应用,真机调试时,我们期望看到log包打出的日志, 这时候就需要借用 Android Device Monitor 了. 我们的 go 代码中用最简单的 log.Printl ...

  4. SecureCRT的背景和文字颜色的修改

    options->;session options->;emulation->;terminal选择linux(相应的服务器系统)ansi color 打上钩options-> ...

  5. SSH连接问题

    新安装的ubuntu14.04无法使用root用户ssh连接,显示ssh root permission denied 解决方法: /etc/ssh/sshd_confg: PermitRootLog ...

  6. Nginx 内置全局变量

    Nginx在使用过程中,有不少的内置全局变量可以用做条件判断和编程控制,本文总结一些已知的指令,以供参考. $arg_PARAMETER  这个变量包含在查询字符串时GET请求PARAMETER的值. ...

  7. (转)c#多线程 Invoke方法的使用

    原文地址:http://www.cnblogs.com/lovko/archive/2008/12/19/1358748.html 在多线程编程中,我们经常要在工作线程中去更新界面显示,而在多线程中直 ...

  8. [译]使用AES 256以达到SSL/TLS安全最大化

    原文链接:https://luxsci.com/blog/256-bit-aes-encryption-for-ssl-and-tls-maximal-security.html 原文发表时间:201 ...

  9. MyBatis框架

    MyBatis是支持普通SQL查询,存储过程和高级映射的优秀持久层框架.MyBatis消除了几乎所有的JDBC代码和参数的手工设置以及对结果集的检索封装.MyBatis可以使用简单的xml或者注解用于 ...

  10. OpenStack-Mitaka 一键安装测试环境脚本

    说明:这个脚本是采用Bash Shell编写,这个版本还只能作为测试环境搭建使用. 此脚本原形的发起人是网友:WuYuLiang.这里有他的博客链接:   第一版的链接: http://blog.cs ...