jQuery 获取对象 根据属性、内容匹配, 还有表单元素匹配

jQuery 可以根据属性、内容或表单元素的特定属性来获取元素对象，下面详细讲解如何进行选择器的匹配。

根据属性值进行匹配

我们可以使用属性选择器来获取指定属性值的元素。例如，要获取所有具有“data-type=example”的元素，可以使用以下 jQuery 选择器：

$("[data-type='example']")

注意属性值要用单引号或双引号包裹，同时等号两边不要留空格，否则选择器不能正确匹配。

根据内容进行匹配

我们还可以使用内容选择器来获取指定内容的元素。例如，要获取页面中所有包含“hello”的元素，可以使用以下 jQuery 选择器：

$(":contains('hello')")

注意，该选择器会匹配所有包含指定文本的元素，包括文本节点和元素节点。如果只需匹配元素节点，可以加上 element 伪类：

$(":contains('hello'):not(:has(*))")

根据表单元素进行匹配

表单元素可以根据其属性值或类型进行匹配。例如，要获取所有文本框，可以使用以下 jQuery 选择器：

$("input[type='text']")

注意：属性值也要用单引号或双引号包裹，属性名和属性值之间不能有空格。可以通过修改 type 属性值来获取其他类型的表单元素。

另外，还可以使用 :input 伪类选择器来获取所有表单元素：

$(":input")

这个选择器将选择文本框、密码框、单选框、复选框、下拉框等所有表单元素。

示例说明

示例一

假设有下面的 HTML 代码：

<div data-type="example">example div</div>

要获取该 div 标签，可以使用属性选择器，如下：

$("[data-type='example']")

示例二

假设有下面的 HTML 代码：

<p>hello world!</p>

要获取该 p 标签，可以使用内容选择器，如下：

$(":contains('hello'):not(:has(*))")

注意，这个选择器将返回文本节点和 p 元素节点，如果只需返回 p 元素节点，可以进一步添加 :not(:has(*)) 过滤器。

以上就是 jQuery 根据属性、内容和表单元素匹配的攻略，希望对你有帮助。