添加属性选择器 jQuery - JavaScript

在 jQuery 中，您可以很容易地选择元素的属性。这是通过属性选择器完成的，属性选择器允许您选择那些具有给定属性或属性值的元素。在本教程中，我们将介绍如何使用 jQuery 属性选择器来选择元素。

属性选择器

属性选择器用于选择带有特定属性或属性值的元素。以下是一些可用的属性选择器：

• [attribute]：选择带有指定属性的元素。
• [attribute=value]：选择具有指定属性值的元素。
• [attribute!=value]：选择不含有指定属性值的元素。
• [attribute^=value]：选择具有属性值以指定值开头的元素。
• [attribute$=value]：选择具有属性值以指定值结尾的元素。
• [attribute*=value]：选择具有属性值包含指定值的元素。

添加属性

使用 jQuery，可以很容易地添加元素的属性。以下是一个示例，演示如何向一个 <p> 元素添加一个 "title" 属性：

$("p").attr("title", "This is a title");

在上面的例子中，我们使用了 attr() 函数来给所有的 <p> 元素添加了一个属性。

选择有属性的元素

在 jQuery 中，您可以通过使用 [] 符号来选择具有特定属性或属性值的元素。以下示例说明了如何选择所有具有 "title" 属性的 <p> 元素：

$("p[title]")

在上面的代码中，我们选择了所有具有 "title" 属性的 <p> 元素。

选择具有特定属性值的元素

如果您想选择具有特定属性值的元素，您可以使用特定的值作为选择器的一部分。以下是一个示例，演示如何选择所有带有 "title" 属性并具有 "Hello World" 属性值的 <p> 元素：

$("p[title='Hello World']")

在上面的代码中，我们选择了带有 "title" 属性并具有 "Hello World" 属性值的所有 <p> 元素。

选择具有特定属性值的元素（使用*=操作符）

如果您想选择所有具有特定属性值的元素（不仅仅是完全匹配），您可以使用 *= 操作符。以下是一个示例，演示如何选择所有带有 "title" 属性并且属性值包含 "Hello" 的 <p> 元素：

$("p[title*='Hello']")

在上面的代码中，我们选择了所有带有 "title" 属性并且属性值包含 "Hello" 的 <p> 元素。

总结

本文介绍了如何在 jQuery 中使用属性选择器来选择元素。通过使用属性选择器，您可以选择具有指定属性或属性值的元素。

参考文献

• jQuery 属性选择器