`
BlueFuture
  • 浏览: 53320 次
  • 性别: Icon_minigender_1
  • 来自: 大连
最近访客 更多访客>>
社区版块
存档分类
最新评论

Jquery选择器(六) -- Attribute Filters

阅读更多

属性过滤器

注意:在jQuery1.3中,[@attr] 形式的选择器已被移除(它们在1.2版本中被弃用)。为了使它们能够继续使用,你只要简单的将选择器中的"@"符号删除。

[1]  [attribute]      Returns: Array<Element(s)>
      说明: 匹配给定属性的所有元素。注意:自从版本1.2起,属性名前的"@"符号被弃用。      
      

Js代码 复制代码
  1. $("div[id]").one("click"function(){   
  2.    var idString = $(this).text() + " = " + $(this).attr("id");   
  3.    $(this).text(idString);   
  4. });  
$("div[id]").one("click", function(){
   var idString = $(this).text() + " = " + $(this).attr("id");
   $(this).text(idString);
});


       attribute: String--一个属性名。

[2]  [attribute=value]      Returns: Array<Element(s)>
      说明: 匹配给定带有确定值的属性的所有元素。  
      

Js代码 复制代码
  1. $("input[name='newsletter']").next().text(" is newsletter");  
$("input[name='newsletter']").next().text(" is newsletter");


       attribute: String--一个属性名。
       value: String--一个属性值。属性值的引号在大多数情况下是可选的。但如果值中包含像"]"的字符,必需使用引号来避免冲突。用变量的话可以使用如下语法:[name='''+MyVar+ ''']

[3]  [attribute!=value]       Returns: Array<Element(s)>
      说明: 匹配没有指定的属性或给定不带确定值的属性的所有元素。  
      

Js代码 复制代码
  1. $("input[name!=newsletter]").next().append("<b>; not newsletter</b>");  
$("input[name!=newsletter]").next().append("<b>; not newsletter</b>");


       attribute: String--一个属性名。
       value: String--一个属性值。属性值的引号在大多数情况下是可选的。但如果值中包含像"]"的字符,必需使用引号来避免冲突。用变量的话可以使用如下语法:[name='''+MyVar+ ''']

[4]  [attribute^=value]      Returns: Array<Element(s)>
      说明: 匹配属性值以value字串开始属性的所有元素。  
      

Js代码 复制代码
  1. $("input[name^='news']").val("news here!");  
$("input[name^='news']").val("news here!");


       attribute: String--一个属性名。
       value: String--一个属性值。属性值的引号在大多数情况下是可选的。但如果值中包含像"]"的字符,必需使用引号来避免冲突。用变量的话可以使用如下语法:[name='''+MyVar+ ''']

[5]  [attribute$=value]      Returns: Array<Element(s)>
      说明: 匹配属性值以value字串结束的属性的所有元素。
      

Js代码 复制代码
  1. $("input[name$='letter']").val("a letter");  
$("input[name$='letter']").val("a letter");


       attribute: String--一个属性名。
       value: String--一个属性值。属性值的引号在大多数情况下是可选的。但如果值中包含像"]"的字符,必需使用引号来避免冲突。用变量的话可以使用如下语法:[name='''+MyVar+ ''']

[6]  [attribute*=value]      Returns: Array<Element(s)>
      说明: 匹配属性值中包含value字串的属性的所有元素。  
      

Js代码 复制代码
  1. $("input[name*='man']").val("has man in it!");  
$("input[name*='man']").val("has man in it!");


       attribute: String--一个属性名。
       value: String--一个属性值。属性值的引号在大多数情况下是可选的。但如果值中包含像"]"的字符,必需使用引号来避免冲突。用变量的话可以使用如下语法:[name='''+MyVar+ ''']


[7]  [attributeFilter1][attributeFilter2][attributeFilterN]       Returns: Array<Element(s)>
      说明: 匹配符合所有给定属性过滤器的所有元素。  
      

Js代码 复制代码
  1. $("input[id][name$='man']").val("only this one");  
$("input[id][name$='man']").val("only this one");


       attributeFilter1: Selector--一个属性过滤器。
       attributeFilter2: Selector--另一个属性值。
       attributeFilterN: Selector--按需要设定任意个过滤器。

分享到:
评论

相关推荐

    JQuery基础教程(圣思园)

    《JQuery基础教程(圣思园)》是...通过以上分析,可以看出圣思园的《JQuery基础教程》不仅涵盖了JQuery选择器的基础知识,还深入探讨了不同选择器的细节和应用场景,对于初学者理解和掌握JQuery选择器具有极高的价值。

    jquery.cheatsheet.1.4.pdf

    综上所述,jQuery Cheat Sheet 1.4 提供了一个全面而深入的指南,涵盖了 jQuery 的核心概念、选择器、事件处理、属性管理等多个方面,对于学习和掌握 jQuery 极具价值。无论是初学者还是资深开发者,都能从中找到...

    jquery1.5 参考文档

    在 jQuery 1.5 中,基础选择器是构建更复杂查询的基石,包括: - `#id`:选取具有指定 ID 的元素。 - `element`:选取指定类型的元素。 - `.class`:选取具有指定类名的元素,多个类名可通过`.`分隔。 - `*`:选取...

    jQuery完全实例.rar

    这个函数接收一个包含 CSS 选择器的字符串,然后用这个字符串去匹配一组元素。 jQuery 的核心功能都是通过这个函数实现的。 jQuery中的一切都构建于这个函数之上,或者说都是在以某种方式使用这个函数。这个函数最...

    jQuery 1.2 Cheat Sheet

    ### jQuery 1.2 Cheat Sheet...以上是对 jQuery 1.2 Cheat Sheet 的详细解读,涵盖了其核心功能、属性操作、选择器等方面的使用方法。通过这份速查手册,用户能够快速掌握 jQuery 的主要功能,并将其应用到实际开发中。

    jQuery 1.6最新版本

    首先,jQuery 1.6对选择器引擎进行了优化,使得在处理复杂的选择器表达式时性能得到了提升。这使得开发者可以更加高效地选取DOM元素,提高网页的响应速度。 其次,1.6版本引入了属性上下文(context)的概念。在...

    CSS3卡通太阳白云动画特效.zip

    1. **选择器**:CSS3引入了更精确的选择器,如类选择器(`.class`)、ID选择器(`#id`)、属性选择器(`[attribute=value]`)以及伪类和伪元素(`:hover`, `::before`, `::after`等),这些都在创建动画特效时起着...

    ASP_NET_4_and_Visual_Studio_2010_Web_Development_Overview.pdf

    - **增强的过滤支持(Enhanced Support for Filters)**:Visual Studio 2010提供了更加强大的过滤器支持,可以帮助开发者更高效地处理请求。 综上所述,ASP.NET 4.0和Visual Studio 2010的结合为Web开发带来了许多新...

    请求Web Api接口

    1. **设置项目**:创建一个新的ASP.NET Web应用项目,选择“Web API”模板。 2. **定义控制器**:创建一个继承自`ApiController`的类,如`ValuesController`,并在此类中定义处理HTTP请求的方法。这些方法会返回数据...

    纯css3玫瑰花瓣掉落特效

    1. **选择器**:CSS3引入了更精确的选择器,如类选择器(`.class`)、ID选择器(`#id`)以及属性选择器(`[attribute=value]`),这使得我们可以针对性地操作特定元素,比如在这里可能用到`.rose-petal`来选中每一片...

Global site tag (gtag.js) - Google Analytics