jquery选择器 | 易学教程

jQuery基础 - 改变CSS样式

阅读更多关于 jQuery基础 - 改变CSS样式

jQuery提供 css() 的方法来实现嵌入式改变元素样式， css() 方法在使用上具有多样性。其中一种接受两个输入参数：样式属性和样式值，它们之间用逗号分开。比如我们要改变链接颜色，我们可以使用下面的代码： $("#61dh a").css('color','#123456'); //这里选择器‘$("#61dh a")’表示ID为‘#61dh’的元素下的所有链接。 //.css(‘color’,'#123456');表示把颜色设为'#123456' 如果我们需要改变多个样式属性，我们可以先定义属性变量，然后直接赋值给 css() 方法。示例如下： var divcss = { background: '#EEE', width: '478px', margin: '10px 0 0', padding: '5px 10px', border: '1px solid #CCC' }; $("#result").css(divcss); //这里我们先定义了一个CSS样式属性变量‘divcss’，这类似于建立一个外部CSS文件。 //然后通过jQuery提供的css()方法，把属性赋给ID为'#result'的DIV。另外jQuery提供的 css() 方法还可以用来查看某个元素的css属性值。例如，我们想查看链接的颜色，可以使用下面的代码： $("#61dh a").css

jQuery学习(三)——选择器总结

阅读更多关于 jQuery学习(三)——选择器总结

1、基本选择器 id选择器：$(“#id名称”); 元素选择器：$(“元素名称”); 类选择器：$(“.类名”); 通配符：* 多个选择器共用(并集) 案例代码： 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>基本选择器</title> 6 <link rel="stylesheet" href="../../css/style.css" /> 7 <script type="text/javascript" src="../../js/jquery-1.8.3.js" ></script> 8 <script> 9 $(function(){ 10 $("#btn1").click(function(){ 11 $("#one").css("background-color","pink"); 12 }); 13 14 $("#btn2").click(function(){ 15 $(".mini").css("background-color","pink"); 16 }); 17 18 $("#btn3").click(function(){ 19 $("div").css("background-color","pink"); 20 }); 21 22 $("#btn4")

Jquery过滤选择器，选择前几个元素，后几个元素，内容过滤选择器等

阅读更多关于 Jquery过滤选择器，选择前几个元素，后几个元素，内容过滤选择器等

一、基本过滤选择器(重点掌握下列八个) :first 选取第一个元素 $("div:first").css("color","red"); :last 选取最后一个元素 $("div:last").css("color","red"); :not 除去指定的选择器外的元素 $("div:not").css("color","red"); :even 选取索引号是偶数的元素 $("div:even").css("color","red"); :odd 选取索引号是奇数的元素 $('div:odd').css("color","red"); :eq(index) 选取第index个元素 $('div:eq(5)').css("color","red"); :gt(index) 选取索引号大于index的元素 $('div:gt(8)').css("color","red"); :lt(index) 选取索引号小于index的元素$('div:lt(3)').css("color","red"); 二、属性过滤选择器（六个必须记住） (1):[attribute] 选取拥有此属性的元素 $('div:[attribute]').css('background-color','red'); (2):[attribute=value] 选取属性值为value的元素 $('div:

jQuery find() 方法的使用总结

阅读更多关于 jQuery find() 方法的使用总结

定义和用法 find() 方法获得当前元素集合中每个元素的后代，通过选择器、jQuery 对象或元素来筛选。搜索所有段落中的后代 span 元素，并将其颜色设置为红色： $("p").find("span").css('color','red'); <!DOCTYPE html> <html> <head> <script type="text/javascript" src="/jquery/jquery.js"></script> </head> <body> <p><span>Hello</span>, how are you?</p> <p>Me? I'm <span>good</span>.</p> <script> $("p").find("span").css('color','red'); </script> </body> </html> 效果：语法 .find(selector) 参数描述 selector 字符串值，包含供匹配当前元素集合的选择器表达式。详细说明如果给定一个表示 DOM 元素集合的 jQuery 对象，.find() 方法允许我们在 DOM 树中搜索这些元素的后代，并用匹配元素来构造一个新的 jQuery 对象。.find() 与 .children() 方法类似，不同的是后者仅沿着 DOM 树向下遍历单一层级。 .find()

jQuery.data() 的实现方式

阅读更多关于 jQuery.data() 的实现方式

jQuery.data() 的作用是为普通对象或 DOM Element 附加（及获取）数据。下面将分三个部分分析其实现方式： 1. 用name和value为对象附加数据；即传入三个参数，第一个参数为需要附加数据的对象，第二个参数为数据的名称，第三个参数为数据的值。当然，只是获取值的话，也可以不传入第三个参数。 2. 用另一个对象为对象附加数据；即传入两个参数，第一个参数为需要附加的数据对象（我们称之为“obj”），第二个参数也是一个对象（我们称之为“another”）；“another”中包含的键值对将会被复制到 “obj” 的数据缓存（我们称之为“cache”）中。 3. 为 DOM Element 附加数据；DOM Element 也是一种 Object ，但 IE6、IE7 对直接附加在 DOM Element 上的对象的垃圾回收存在问题；因此我们将这些数据存放在全局缓存（我们称之为“globalCache”）中，即 “globalCache” 包含了多个 DOM Element 的 “cache”，并在 DOM Element 上添加一个属性，存放 “cache” 对应的 uid 。用name和value为对象附加数据使用 jQuery.data() 为普通对象附加数据时，其本质是将一个 “cache” 附加到了对象上，并使用了一个特殊的属性名称。存放数据的

jQuery 结构分析

阅读更多关于 jQuery 结构分析

jquery核心转自 http://www.iteye.com/topic/783260 (function( window, undefined ) { // 构造jQuery对象 var jQuery = function( selector, context ) { return new jQuery.fn.init( selector, context, rootjQuery ); } // 工具函数 Utilities // 异步队列 Deferred // 浏览器测试 Support // 数据缓存 Data // 队列 queue // 属性操作 Attribute // 事件处理 Event // 选择器 Sizzle // DOM遍历 // DOM操作 // CSS操作 // 异步请求 Ajax // 动画 FX // 坐标和大小 window.jQuery = window.$ = jQuery; })(window); 一构造jquery. 相对于其它库里传统的构造对象方法. jquery提供了一种截然不同的方法. 它选择创造一个全新的奇异世界. 首先所有的jquery代码被一个自动执行的闭包包裹起来, 只在后面暴露$和jQuery这2个变量给外界尽量避开变量冲突. Java代码 (function(window, undefined){ ….. })

js 有用的代码

阅读更多关于 js 有用的代码

1. 如何创建嵌套的过滤器： // 允许你减少集合中的匹配元素的过滤器， // 只剩下那些与给定的选择器匹配的部分。在这种情况下， // 查询删除了任何没（ :not ）有（ :has ） // 包含 class 为“ selected ”（ .selected ）的子节点。 .filter(":not(:has(.selected))") 2. 如何重用元素搜索 var allItems = $("div.item"); var keepList = $("div#container1 div.item"); // 现在你可以继续使用这些 jQuery 对象来工作了。例如， // 基于复选框裁剪“ keep list ”，复选框的名称 // 符合 < DIV >class names: $(formToLookAt + " input:checked").each(function() { keepList = keepList.filter("." + $(this).attr("name")); }); < /DIV> 3. 任何使用 has() 来检查某个元素是否包含某个类或是元素： //jQuery 1.4.* 包含了对这一 has 方法的支持。该方法找出 // 某个元素是否包含了其他另一个元素类或是其他任何的 // 你正在查找并要在其之上进行操作的东东。 $(

jquery操作\"元素属性\"

阅读更多关于 jquery操作\"元素属性\"

我们可以使用javascript中的getAttribute和setAttribute来操作元素的"元素属性". 在jQuery中给你提供了attr()包装集函数, 能够同时操作包装集中所有元素的属性: 名称说明举例 attr( name ) 取得第一个匹配元素的属性值。通过这个方法可以方便地从第一个匹配元素中获取一个属性的值。如果元素没有相应属性，则返回 undefined 。返回文档中第一个图像的src属性值: $("img").attr("src"); attr( properties ) 将一个“名/值”形式的对象设置为所有匹配元素的属性。这是一种在所有匹配元素中批量设置很多属性的最佳方式。注意，如果你要设置对象的class属性，你必须使用'className' 作为属性名。或者你可以直接使用.addClass( class ) 和 .removeClass( class ). 为所有图像设置src和alt属性: $("img").attr({ src: "test.jpg", alt: "Test Image" }); attr( key, value ) 为所有匹配的元素设置一个属性值。为所有图像设置src属性: $("img").attr("src","test.jpg"); attr( key, fn ) 为所有匹配的元素设置一个计算的属性值。不提供值

【锋利的jQuery】学习笔记03

阅读更多关于【锋利的jQuery】学习笔记03

第三章 jQuery中的DOM操作一、DOM操作的分类 DOM(document object model)是一种与浏览器、平台、语言无关的接口，使用该接口可以访问页面中的·所有组件。DOM的操作可以分为DOM Core、HTML-DOM和CSS-DOM。 DOM Core：任意支持DOM的程序设计语言都可以使用。JS中getElementById(),getelementByTagName(),getAttribute()和setAttribute()都是它的组成部分。 HTML-DOM:提供了一些更加简明的记号描述各种Html元素，只能用来处理web文档。eg:document.forms CSS-DOM:是针对CSS的操作，用于获取和设置style对象的各种属性。eg:element.style.color 二、jQueryDOM操作——节点操作查找节点查找元素节点可以直接使用选择器进行查找。 1 var $li=$("ul li:eq(1)"); //获取ul中的第二个li节点 2 var li_text=$li.text(); //获取第二个li元素节点的文本内容 3 alert(li_text); //打印文本内容 2.查找属性节点找到元素节点后，使用attr()方法获取设置元素的属性。attr()方法传入参数为一个时为获取该属性的值

python之路 jquery

阅读更多关于 python之路 jquery

简介： jQuery是一个兼容多浏览器的javascript库，核心理念是write less,do more(写得更少,做得更多)。jQuery在2006年1月由美国人John Resig在纽约的barcamp发布，吸引了来自世界各地的众多JavaScript高手加入，由Dave Methvin率领团队进行开发。如今，jQuery已经成为最流行的javascript库，在世界前10000个访问最多的网站中，有超过55%在使用jQuery。参考文档： http://jquery.cuishifeng.cn/ 一、导入+简单应用 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>shuaige</title> <style> .r { background-color:red; /* 给标签设置背景颜色为红色*/ } </style> </head> <body> <div id="id_1"> 123 </div> <div class="c1">1</div> <div class="c1">2</div> <div class="c1">3</div>  <script type="text/javascript" src="jquery-1.8.2

订阅 jquery选择器