很多jQuery代码都有如下片段:

$(document).ready(function(){

  //代码

})

作用就是等文档结构加载完成后再去执行function中的代码，功能类似于window.onload事件。

代码实例如下:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta name="author" content="http://www.softwhy.com/" />

<title>蚂蚁部落</title>

<style type="text/css">

div{

  height:150px;

  width:150px;

  background-color:#ccc;

}

</style>

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

<script type="text/javascript">

$(document).ready(function(){

  $("div").hide();

})

</script>

</head>

<body>

<div></div>

</body>

</html>

上面代码能够将div元素隐藏。但是如果将代码修改如下：

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta name="author" content="http://www.softwhy.com/" />

<title>蚂蚁部落</title>

<style type="text/css">

div{

  height:150px;

  width:150px;

  background-color:#ccc;

}

</style>

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

<script type="text/javascript">

$("div").hide();

</script>

</head>

<body>

<div></div>

</body>

</html>

运行上面的代码却不能够隐藏div元素。

由于代码是顺序执行的，那么当代码执行到$("div").hide()时候，文档中的div元素还没有加载完成，那么$("div")也就无法获取到div对象，于是$("div").hide()就无效了。

http://www.softwhy.com/article-993-1.html

http://www.softwhy.com/qiduan/jQuery_source/

http://www.softwhy.com/

jQuery文档就绪的更多相关文章

  1. jQuery文档就绪事件

    [jQuery文档就绪事件] 为了防止文档在完全加载(就绪)之前运行 jQuery 代码.如果在文档没有完全加载之前就运行函数,操作可能失败. $(document).ready(function() ...

  2. JQuery语法 JQuery对象与原生对象互转 文档就绪函数与window.onload的区别

    [JQuery语法] 1.jQuery("选择器").action();通过选择器调用事件函数,但是jquery中,jquery可以用$(“选择器”).action();   ① ...

  3. jQuery 效果函数，jquery文档操作，jQuery属性操作方法，jQuerycss操作函数，jQuery参考手册-事件，jQuery选择器

    jQuery 效果函数 方法 描述 animate() 对被选元素应用“自定义”的动画 clearQueue() 对被选元素移除所有排队的函数(仍未运行的) delay() 对被选元素的所有排队函数( ...

  4. jQuery 核心 - noConflict() 方法,jQuery 文档操作 - detach() 方法

    原文地址:http://www.w3school.com.cn/jquery/manipulation_detach.asp   实例 使用 noConflict() 方法为 jQuery 变量规定新 ...

  5. jQuery文档加载完毕的几种写法

    js中文档加载完毕.一般在body加一个onload事件或者window.onload = function () {} jQuery中有好多写法,平时也不注意,别人一问,还真觉得头大. 下面是我整理 ...

  6. jQuery 文档操作方法

    jQuery 文档操作方法 这些方法对于 XML 文档和 HTML 文档均是适用的,除了:html(). 方法 描述 addClass() 向匹配的元素添加指定的类名. after() 在匹配的元素之 ...

  7. jQuery文档操作

    jQuery文档操作 1.jq文档结构 var $sup = $('.sup'); $sup.children(); // sup所有的子级们 $sup.parent(); // sup的父级(一个, ...

  8. jQuery文档操作方法对比和src写法

    jQuery文档操作方法对比 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

  9. jquery文档加载几种写法，图片加载写法

    jquery文档加载写法: $(function(){ }) ; //个人最常使用方式 $(document).ready(function(){ }); //调用文档对象下的ready方法传入一个函 ...

随机推荐

  1. noip模拟赛 猜数字

    题目描述 LYK在玩猜数字游戏. 总共有n个互不相同的正整数,LYK每次猜一段区间的最小值.形如[li,ri]这段区间的数字的最小值一定等于xi. 我们总能构造出一种方案使得LYK满意.直到…… LY ...

  2. python——正则表达式的理解

    概念:又称规则表达式,常用来检索.替换符合某个规则的文本. 理解:特殊字符--------->规则---------->过滤字符串 目的:1.匹配给定的字符串,2.从字符串中过滤出我们需要 ...

  3. 解决CDH SparkStreaming任务启动之后executor不停增长的问题,num-executors配置不管用。

    spark2-submit --class SparkKafka --master yarn --executor-memory 1G --num-executors 6 --driver-memor ...

  4. 微信小程序初探(二):阅读官方demo源码

    阅读demo有助于理解逻辑,而且demo源码中应该包含了框架开发人员想要表达的意思的精华,先从app.js着手来阅读. 附带贴下说明: https://mp.weixin.qq.com/debug/w ...

  5. 网上的仿QQ验证码，详细使用方法

    struts2的配置 和代码 1.生成图片流 类名:VerifyCodeUtils /** * 生成图片流 * @author Administrator * */ import java.awt.C ...

  6. 记一次 Hibernate 插入数据中文乱码报错解决

    错误描述 程序运行,向表中插入数据(包含中文)报错:\xE6\xB2\x88\xE9\x9B\xAA... 但是自己另外新建一个数据库手动插入数据中文正常,同样修改数据库,表的编码之后同样不行.而且 ...

  7. docker重新打包MySQL5.7镜像

    1:先下载MySQL镜像 # docker pull  mysql:5.7   2:运行镜像生成容器 # docker run --name mysql -p 3306:3306 -e MYSQL\_ ...

  8. Tomcat配置文件server.xml（转）

    前言 Tomcat隶属于Apache基金会,是开源的轻量级Web应用服务器,使用非常广泛.server.xml是Tomcat中最重要的配置文件,server.xml的每一个元素都对应了Tomcat中的 ...

  9. MySQL: 改变Homebrew安装MySQL/MariaDB的数据库文件目录

    1. brew install mariadb 2. mysql_install_db --verbose --user=$USER --basedir=/usr/local/Cellar/maria ...

  10. 开源软件Review Board

    开源软件, Review Board 代码审查的. https://www.reviewboard.org/