Jquery选择器(六) -- Attribute Filters

最新推荐文章于 2025-11-22 12:21:50 发布

原创最新推荐文章于 2025-11-22 12:21:50 发布 · 192 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jQuery #ViewUI

jQuery 专栏收录该内容

20 篇文章

订阅专栏

本文介绍jQuery中用于选择具有特定属性的元素的属性过滤器。详细解释了如何使用这些过滤器来选择不同属性值的元素，并提供了示例代码。

属性过滤器

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

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

Js代码

$("div[id]").one("click", function(){
var idString = $(this).text() + " = " + $(this).attr("id");
$(this).text(idString);
});

$("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代码

$("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代码

$("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代码

$("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代码

$("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代码

$("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代码

$("input[id][name$='man']").val("only this one");

$("input[id][name$='man']").val("only this one");

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