() // 入口 $(document).ready(function(){ // 执行代码 }); $(function(){ // 执行代码 }); JavaScript的入口函数 //...： $("selector:first") 匹配第一个元素 $("selector:last") 匹配最后一个元素 $("selector:odd") 匹配索引值为奇数的元素，从0开始计数 $("selector...:even") 匹配索引值为偶数的元素，从0开始计数 $("selector.eq(n)") 匹配集合中索引值为n的元素 $("selector.gt(n)") 匹配集合中索引值大于n的元素 $("selector...}) 将jquery函数代码放到这个函数就可以等到页面加载结束再运行。...dom中删除被选元素以及子元素，就是如果某个元素被删除了，那么它的后代元素也都被删除。
背景 在现在就业的过程中，会运用JQuery是你的加分项，那么什么是JQuery，嗯，jquery是JavaScript的函数库，是一种轻量级的JavaScript库，写得少，做的多，导致jQuery有很多技术人员在使用它做项目...jQuery目录.png jQuery语法 基础语法： 美元符号定义 jQuery 选择符() "查询"和"查找" HTML 元素 jQuery 的方法执行对元素的操作 jQuery代码 $(document...).ready(function(){ //这里是jQuery代码 }); $(function(){ // 这里是jQuery代码 }); $( function() {} ); DOM加载完成后才可以对...DOM进行操作，如果文档没有完全加载之前运行函数，会导致操作失败。...()方法 Not()方法 不匹配这个标准的元素会被从集合中删除，匹配的元素会被返回 Not()方法返回不匹配标准的所有元素 jQuery AJAX AJAX是与服务器交换数据的技术 在不重载全部页面的情况下
本文配合截图、代码和简单的概括对所有jQuery选择器进行了介绍，也列举出了一些需要注意和区分的地方。 一、基本选择器 1. id选择器（指定id元素） 将id="one"的元素背景色设置为黑色。...上面第三个dd会显示"没有内容"文本 ——2.3 :has(selector)（取选择器匹配的元素） $(document).ready(function () { // 为包含...的直系子元素，也会生效 ?...可见性过滤选择器 ——3.1 :hidden（取不可见的元素） jQuery至1.3.2之后的:hidden选择器仅匹配display:none或的元素，而不匹配...参照：http://www.jquerysdk.com/api/hidden-selector 下面的代码，先弹出"hello"对话框，然后hid-1会显示，hid-2仍然是不可见的。 ?
内容目录 jQuery 入门 什么是jQuery 如何使用jQuery jQuery的运行原理 如何选择jQuery版本 ready() 准备就绪时执行代码 jQuery 核心：选取元素...ready() 准备就绪时执行代码 如果我们在中引入jQuery库文件，并编写相应的jQuery代码来操作DOM元素。...这很可能导致操作无法成功，因为此时内的元素可能还没有加载出来，也就获取不到对应的元素。因此，我们一般会将自己的jQuery代码写在ready()事件函数中。...接下来我们进行DOM操作，也应该使用jQuery对象的方法，而不是Element对象的方法。当然，jQuery对象也可以转换为DOM元素，后面我们会提到。...与此不同的是，jQuery在匹配不到对应元素时将返回一个空的jQuery对象，我们仍然可以调用jQuery对象的方法，而且并不会报错。因为jQuery会智能地处理这种情况。
本文配合截图、代码和简单的概括对所有jQuery选择器进行了介绍，也列举出了一些需要注意和区分的地方。 一、基本选择器 1. id选择器（指定id元素） 将id="one"的元素背景色设置为黑色。...上面第三个dd会显示"没有内容"文本 ——2.3 :has(selector)（取选择器匹配的元素） $(document).ready(function () { // 为包含...可见性过滤选择器 ——3.1 :hidden（取不可见的元素） jQuery至1.3.2之后的:hidden选择器仅匹配display:none或的元素，而不匹配...参照：http://www.jquerysdk.com/api/hidden-selector 下面的代码，先弹出"hello"对话框，然后hid-1会显示，hid-2仍然是不可见的。 ?...属性过滤选择器 ——4.1 [attribute]（取拥有attribute属性的元素） 下面的代码，最后一个a标签没有title属性，所以它仍然会带下划线 ?
本文配合截图、代码和简单的概括对所有jQuery选择器进行了介绍，也列举出了一些需要注意和区分的地方。...上面第三个dd会显示"没有内容"文本 ——2.3 :has(selector)（取选择器匹配的元素） $(document).ready(function () { // 为包含span元素的div添加边框...$( 'div:has(span)').css('border', '1px solid #000'); }); 即使span不是div的直系子元素，也会生效 ?...属性过滤选择器 ——4.1 [attribute]（取拥有attribute属性的元素） 下面的代码，最后一个a标签没有title属性，所以它仍然会带下划线 ?...这里有个问题：如果一个元素没有子元素，:first-child和:last-child会返回null吗？
image.png jQuery 入口函数: $(document).ready(function(){ // 执行代码 }); 或者 $(function(){ // 执行代码 });...选择一个上级元素的最后一个同类子元素 :empty 选择的元素里面没有任何内容，这里没有内容指的是一点内容都没有 :not() 否定选择器 :first-line 用于选取指定选择器的首行 :first-letter...jQuery选择器匹配的元素 .add() 将元素添加到匹配元素的集合中 .addSelf() 把堆栈中之前的元素添加到当前集合中 .children() 获取匹配元素集合中每个元素的所有子元素 .closest...() 从元素本身开始，逐级向上元素匹配，并返回最先匹配的祖先元素 .contents() 获得匹配元素集合中每个元素的子元素 .each() 对jQuery对象进行迭代，为每个匹配元素执行函数 .end...() 把所有匹配的元素用指定的内容或元素包裹起来 wrapinner() 将每一个匹配的元素的子内容用指定的内容或元素包裹起来 jQuery hide() 和 show()隐藏和显示 HTML 元素
image.png jQuery 入口函数: $(document).ready(function(){ // 执行代码 }); 或者 $(function(){ // 执行代码 });...选择一个上级元素的最后一个同类子元素 :empty 选择的元素里面没有任何内容，这里没有内容指的是一点内容都没有 :not() 否定选择器 :first-line 用于选取指定选择器的首行 :first-letter...jQuery选择器匹配的元素 .add() 将元素添加到匹配元素的集合中 .addSelf() 把堆栈中之前的元素添加到当前集合中 .children() 获取匹配元素集合中每个元素的所有子元素 .closest...() 从元素本身开始，逐级向上元素匹配，并返回最先匹配的祖先元素 .contents() 获得匹配元素集合中每个元素的子元素 .each() 对jQuery对象进行迭代，为每个匹配元素执行函数 .end...jQuery load() 方法是简单但强大的 AJAX 方法 $(selector).load(URL,data,callback); $(document).ready(function
jquery代码： $().ready(function(){ }); // 导包,引入JQ的文件 <script type="text/javascript" src="../.....([[data],fn]) 触发每一个匹配的click事件，这个函数会调用执行绑定到click事件的所有函数。...fn,在每个匹配元素的click世界中绑定的处理函数 [data],fn $("p").click(); // 所有段落点击隐藏 $("p").click( function(){ $(this).hide...">hello jquery代码 $("p").show() jquery库可以通过一行简单的代码添加到网页中，库包含html元素选取和操作，css操作，html事件函数，JavaScript特效和动画...this).hide()隐藏当前的 HTML 元素 $(selector).action() $(this).hide() - 隐藏当前元素 jquery函数 // 为了防止文档完全加载就绪之前运行的代码
注意 :在设置或读取元素属性时,attr()和prop()基本没有区别;但是在读取或设置表单元素(按钮)的选中状态时,必须用prop()方法,attr()不会监听按钮选中状态的改变,只看标签属性checked...$(selector).each () 方法规定为每个匹配元素规定运行的函数 $(selector).each(function(){ body }) 匹配元素并规定运行的函数。..., function(){ body }); 为元素对象列表中的每个元素规定运行的函数。...(function(){ //文档加载完毕后执行 }) 区别：原生 onload 事件不能重复书写，会产生覆盖问题；jquery 中对事件做了优化，可以重复书写 ready 方法，依次执行 事件绑定方式...实战 页面效果 代码分析 页面元素 初始代码 绑定省份 绑定城市
> 入口函数 为了防止文档在完全加载（就绪）之前运行 jQuery 代码，即在 DOM 加载完成后才可以对 DOM 进行操作。...可以将 jQuery 代码位于一个 $(document).ready() 函数中 $(document).ready(function(){ // 执行代码 alert...执行 window.onload $(document).ready 执行时机 必须等网页全部加载完毕，包含图片等，再执行onload 只需等待页面中DOM结构加载完毕 执行次数 只执行一次，第二个会覆盖前面的...jQuery 基本语法 通过jQuery 可以对元素查询修改操作，也可以添加事件。...基本语法结构 美元符号定义 jQuery 选择符（selector）”查询”和”查找” HTML 元素 jQuery 的 action() 执行对元素的操作 $(selector).action()
/page/tag/jquery-event-methods 1,ready ready()函数用于在当前文档结构载入完毕后立即执行指定的函数。...即使是执行live()函数之后新添加的元素，只要它匹配当前jQuery对象的选择器，绑定的事件处理函数仍然对其有效。 要删除通过live()绑定的事件，请使用die()函数。...即使是执行on()函数之后新添加的元素，只要它符合条件，绑定的事件处理函数也对其有效。 要删除通过on()绑定的事件，请使用off()函数。...] [, data ] ) 示例&说明： 以点击事件("click")为例，以下是jQuery中事件函数的常规用法(某些函数也存在其它形式的用法，此处暂不列出)： // 这里的选择器selector用于指定可以触发事件的元素...使用该函数可以手动触发执行元素上绑定的事件处理函数，也会触发执行该元素的默认行为。
ready(function () { 代码块 }); 方式二: $(function () { 代码块 }); JS的入口函数: window.onload = function...() { 代码块 }; 两种入口函数的区别: 1.jQuery的入口函数要比JS的入口函数先执行; 2.jQuery的入口函数会等待页面加载完成才执行,但不会等待图片的加载;...,会造成内存泄漏,绑定的事件不会清除. remove: 相比于empty,自身也删除 注意:jQuery remove() 方法也可接受一个参数,允许您对被删元素进行过滤: $("p").remove...(true) 返回值为复制的新元素,和原来的元素没有任何关系.即修改新元素,不会影响到原来的元素 $(selector).clone(); jQuery特殊属性操作 1.1 val方法...each作用:遍历jQuery对象集合,为每个匹配的元素执行一个函数 $(selector).each(function(index, element){}); 第一个参数表示当前元素所有匹配元素中的索引号
前言: 好久没有更新博客了, 最近想复习下 之前学过的JS的相关内容, 也算是自己的一种总结. 知识长时间不用就会忘记, 多学多记多用!!...">jQuery编程测试 我们编写如下jQuery代码： 用在线编辑器运行一下代码是否和你想象的一样呢?...$(document).ready(function () { // dd元素中包含"jQuery"文本的会变色 $('dd:contains("jQuery")').css('color', '#FF0000...'); }); (7.2) :empty（取不包含子元素或文本为空的元素） $('dd:empty').html('没有内容'); (7.3) :has(selector)（取选择器匹配的元素） 即使span...(9) 属性过滤器 (9.1) [attribute]（取拥有attribute属性的元素） 下面的代码，最后一个a标签没有title属性，所以它仍然会带下划线 代码在9.2 中展示 (9.2) [
基本语法 $(selector).action() 文档就绪函数 所有 jQuery 函数位于一个 document ready 函数中，为了防止文档在完全加载（就绪）之前运行 jQuery 代码。...例如：$("p").css("background-color","red"); 3. jQuery 事件 通常会把 jQuery代码放到部分的事件处理方法中。...Event 函数 绑定函数至 $(document).ready(function) 将函数绑定到文档的就绪事件（当文档完成加载时） $(selector).click(function) 触发或将函数绑定到被选元素的点击事件...不匹配这个标准的元素会被从集合中删除，匹配的元素会被返回。 not() - 与filter()相反。...无法使用缓存文件（更新服务器上的文件或数据库） 2. 向服务器发送大量数据（POST 没有数据量限制） 3.
［5］ jQuery还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。 二 什么是jQuery对象？...ID为 test的元素内的html代码。...[0].innerHTML jQuery的基础语法 $(selector).action() http://jquery.cuishifeng.cn/ <----------参考来自 三 寻找元素(...('click');})就是筛选出ul下的li给其绑定 // click事件； [selector]参数的好处: 好处在于.on方法为动态添加的元素也能绑上指定事件；...外部的代码不能直接访问插件内部的代码。插件内部的代码不污染全局变量。在一定的作用上解耦了插件与运行环境的依赖。
前者是jQuery库的源代码版本，它带有注释信息，建议你在开发环境中使用该文件，以便于调试或阅读源代码。...一：$(document).ready(function(){ // 在这里编写我们希望在DOM准备就绪后执行的代码 jQuery的ready()函数可以重复调用 }); 二：$( function()...{ // 在这里编写我们希望在DOM准备就绪后执行的代码 } ); 4.jQuery 核心：选取元素 $("#uid"); // 选取id属性为"uid"的单个元素 $("p"); // 选取所有的p元素...属性 find("ul") // 返回匹配这些div元素中的所有后代ul元素的jQuery对象 children() // 返回匹配这些ul元素中的所有子代元素的jQuery对象 $("selector...()、toggle()等方法作用相同， * 用法也类似，只是带有不同的动画效果 */ $("selector").slideDown(); // 显示隐藏的元素，带有向下滑动的过渡动画效果 $("selector
返回的是一个类似数组对象，jquery可以通过$p[0]下标来获取对应的对象，也可以获取$p 的长度 ?...页面上没有id=abc的元素，选中原生js对象时，返回的是null，我们可以知道选中这个元素不存在。...，包括所有匹配元素、匹配元素的下级元素、文字节点 通常我们将页面上一个元素插入到DOM里另一个地方，它会被从老地方移走，类似剪切的效果 $('.hello').appendTo('.goodbye');...传递处理函数给.ready()方法，能保证DOM准备好后就执行这个函数，因此，这里是进行所有其它事件绑定及运行其它 jQuery 代码的最佳地方。...如果执行的代码需要在元素被加载之后才能使用时，（例如，取得图片的大小需要在图片被加载完后才能知道），就需要将这样的代码放到 load 事件中。
很多老的项目都是jQuery开发的，所以jQuery还会运行很长时间。...而且对于页面中的iframe等子页面也做了兼容处理。直接用如下的方法进行使用： // 第一种方式： 给document绑定ready事件。...3.3 jQuery的包装对象和DOM对象 通过jQuery的选择器选择出来的对象都是jQuery的包装对象，里面封装了jQuery的很多API方法，后续我们会一一学习。...:contains(text) $("div:contains('John')") 匹配包含给定文本的元素 :not(selector) $("input:not(:checked)") 去除所有与给定选择器匹配的元素...oddTrs.css('backgroundColor', '#aaa'); // jQuery：如果包装对象里面元素是多个时候，做设置操作会影响包装对象中的所有dom对象。
// 释放$的 jQuery 控制权 // 很多 JavaScript 库使用 $ 作为函数或变量名，jQuery 也一样。...// 在 jQuery 中，$ 仅仅是 jQuery 的别名，因此即使不使用 $ 也能保证全部功能性。...// 由于整个jQuery代码都是一整个匿名函数，所以当前context是jQuery。假设要将上下文设置为window则需使用globalEval。...查找是否有全然相等的元素。...将jQuery对象也当成数组处理 // 2.
云服务器
ICP备案
云直播
即时通信 IM
实时音视频
