Jquery中"$(document).ready(function(){ })"函数的使用详解_jquery

Jquery是优秀的Javascrīpt框架,$是jquery库的申明,它很不稳定(我就常遇上),换一种稳定的写法jQuery.noConflict(); jQuery(document).ready(function(){});

使用jQuery的好处是它包装了各种浏览器版本对DOM对象(javascript的DOM对象你应该知道吧,就是它了)的操作.

比如jquery写法:
$("div p"); // (1)
$("div.container"); // (2)
$("div #msg"); // (3)
$("table a",context); // (4)
$("#myId"); //(5)

第一行代码得到所有<div>标签下的<p>元素。第二行代码得到class 为container的<div>元素,第三行代码得到<div>标签下面id为msg的元素。第四行代码得到context为 上下文的table里面所有的连接元素。第五行代码得到id为myid的所有元素

如果你熟悉CSS,你会觉得这些写法很眼熟!对了。正是。看出奥妙了吧。jquery就是通过这样的方式来找到Dom对象里面的元素。跟CSS的选择器相类似。

现在回答你的具体问题吧

$(document).ready(function(){
alert("hello");
});(1)

<body onload="alert('hello');">(2)

上面两段代码是等价的。但代码1的好处是做到表现和逻辑分离。并且可以在不同的js文件中做相同的操作,即$(document).ready (fn)可以在一个页面中重复出现,而不会冲突。基本上Jquery的很多plugin都是利用这个特性,正因为这个特性,多个plugin共同使用起 来,在初始化时不会发生冲突。

如果我们在
$(document).ready(function(){
加入的内容
});
加入内容$(".btn-slide").click(function(){
          alert("你单击了a标签中class等于btn-slide的连接");
});

则表示当我们单击class=btn-slide的超级连接时弹出“你单击了a标签中class等于btn-slide的连接”对话框.

如此方便易用,因此使用jquery是一个不错的选择。

时间: 2025-01-21 07:11:29

Jquery中&quot;$(document).ready(function(){ })&quot;函数的使用详解_jquery的相关文章

jQuery中bind(),live(),delegate(),on()绑定事件方法实例详解_jquery

本文实例分析了jQuery中bind(),live(),delegate(),on()绑定事件方法.分享给大家供大家参考,具体如下: 前言 因为项目中经常会有利用jquery操作dom元素的增删操作,所以会涉及到dom元素的绑定事件方式,简单的归纳一下bind,live,delegate,on的区别,以便以后查阅,也希望该文章日后能帮助到各位朋友,文中如有不当之处,还望各位指正,话不多说,直接进入正题. 一.bind() 简要描述 bind()向匹配元素添加一个或多个事件处理器. 使用方式 复制

jquery中的$(document).ready()使用方法介绍

 本篇文章主要是对jquery中的$(document).ready()使用方法进行了详细的总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助 window.onload = function(){ alert("welcome"); } 这样的写法作用是希望在页面加载完,自动执行定义js代码(function).   $(document).ready(function(){.... })这个函数是用来取代页面中的window.onload;   document.ready()

jquery中的$(document).ready()使用小结_jquery

window.onload = function(){ alert("welcome"); }这样的写法作用是希望在页面加载完,自动执行定义js代码(function). $(document).ready(function(){.... })这个函数是用来取代页面中的window.onload; document.ready()和传统的方法<body onload="load()"> 相似,不同的是onload()的方法是在页面加载完成后才发生,这包括

jQuery中each()、find()和filter()等节点操作方法详解(推荐)_jquery

1.each(callback) 官方解释: 返回值:jQuery 概述 以每一个匹配的元素作为上下文来执行一个函数. 意味着,每次执行传递进来的函数时,函数中的this关键字都指向一个不同的DOM元素(每次都是一个不同的匹配元素).而且,在每次执行函数时,都会给函数传递一个表示作为执行环境的元素在匹配的元素集合中所处位置的数字值作为参数(从零开始的整型). 返回 'false' 将停止循环 (就像在普通的循环中使用 'break').返回 'true' 跳至下一个循环(就像在普通的循环中使用'

jquery中的$(document).ready()与window.onload的区别_jquery

所以如果某个图片或者其他资源加载很长时间, 访问者就会看到一个不完整的页面, 甚至在图片加载之前就执行了需要依赖动态添加的元素的脚本而导致脚本错误.window.onload = function() { testDiv.innerHTML = "<div style=\"border:solid 1px #FF0000\">动态创建的div</div>"; } 解决办法就是等DOM被解析后, 在图像和外部资源加载之前执行我们的函数.在jQu

jQuery.Callbacks()回调函数队列用法详解_jquery

本文实例讲述了jQuery.Callbacks()回调函数队列用法.分享给大家供大家参考,具体如下: 1.jQuery.Callbacks The jQuery.Callbacks() function, introduced in version 1.7, returns a multi-purpose object that provides a powerful way to manage callback lists. It supports adding, removing, firi

jQuery height()、innerHeight()、outerHeight()函数的区别详解_jquery

在jQuery中,获取元素高度的函数有3个,它们分别是height(). innerHeight(). outerHeight(). 与此相对应的是,获取元素宽度的函数也有3个,它们分别是width(). innerWidth(). outerWidth(). 在这里,我们以height().innerHeight().outerHeight()3个函数为例,来详细介绍它们之间的区别. 下面我们以元素element的盒模型为例来介绍它们之间的区别. 函数 高度范围 jQuery版本 支持写操作

jQuery Tags Input Plugin(添加/删除标签插件)详解_jquery

看名字应该知道是干嘛用了吧. 一个jquery开发的标签功能加强插件,可以生成或删除标签,还能对输入重复标签进行检查,和JQuery autocomplete插件配合实现自动完成功能. 官网:http://xoxco.com/projects/code/tagsinput/ 截图: (下面是翻译了官网上的用法,英文不是很好,有能力的尽量看官网吧) 首先,引用下面两个文件 <script src="jquery.tagsinput.js"></script> &l

jQuery对html元素的取值与赋值实例详解_jquery

本文实例讲述了jQuery对html元素的取值与赋值方法.分享给大家供大家参考,具体如下: Jquery给基本控件的取值.赋值 TEXTBOX: var str = $('#txt').val(); $('#txt').val("Set Lbl Value"); //文本框,文本区域: $("#text_id").attr("value",'');//清空内容 $("#text_id").attr("value&qu