jQuery | [属性*=值] 选择器

jQuery是一个广泛应用的JavaScript库，用于在网页中处理HTML文档、执行动画以及处理事件。其中，属性选择器是一种常用的选择器，通过匹配元素的属性值来选择元素。对于需要查找包含指定文本的元素，我们可以使用属性值包含字符串选择器：[属性*=值]。

语法

$("[attribute*=value]")

其中，attribute是一个元素的属性名称，value是要匹配的值。选择器会选取包含attribute属性且属性值包含value的元素。

示例

HTML代码：

<div class="content">
  <h2 data-id="1">JavaScript</h2>
  <p data-lang="js">JavaScript is a programming language that adds interactivity to your website.</p>
  <h2 data-id="2">jQuery</h2>
  <p data-lang="js">jQuery is a fast, small, and feature-rich JavaScript library.</p>
  <h2 data-id="3">HTML</h2>
  <p data-lang="html">HTML is the standard markup language for creating web pages.</p>
</div>

JavaScript代码：

$(document).ready(function() {
  $("p[data-lang*=js]").css("color", "red");
});

运行以上代码，会选中所有data-lang属性值包含"js"的p元素，并将它们的颜色设置为红色。在本例中，两个p元素都包含"data-lang"属性，并且属性值都包含"js"，因此两个元素都会被选中。

总结

使用jQuery的属性值包含字符串选择器"[attribute*=value]"，可以方便快捷地选中包含特定属性值的元素。这种选择器在处理多语言网站、搜索框中的实时查询和关键词高亮等方面非常实用。