常用的 jQuery 选择器

2025-08-27 22:59:20

基本选择器$("element"):选择所有指定的元素。$("#id"):选择具有指定 ID 的元素。$(".class"):选择所有具有指定类名的元素。层次选择器$("selector1 selector2"):选择作为父元素的 selector1 下的所有 selector2 元素。$("selector1 > selector2"):选择直接子元素 selector2 的 selector1 元素。$("selector1 + selector2"):选择紧接在 selector1 元素之后的 selector2 元素。$("selector1 ~ selector2"):选择 selector1 元素之后的所有 selector2 元素。属性选择器$("[element]"):选择具有指定属性的所有元素。$("[element='value']"):选择属性值等于指定值的所有元素。$("[element^='value']"):选择属性值以指定值开头的所有元素。("[element$("[element*='value']"):选择属性值包含指定值的所有元素。内容选择器:contains("text"):选择包含指定文本的所有元素。:empty:选择所有没有子节点的元素。:has(selector):选择所有包含指定元素的父元素。表单选择器:input:选择所有表单元素。:checkbox:选择所有复选框元素。:radio:选择所有单选按钮元素。:text:选择所有文本输入框元素。:password:选择所有密码输入框元素。:submit:选择所有提交按钮元素。:image:选择所有图像输入框元素。:reset:选择所有重置按钮元素。伪类选择器::first:选择每个集合中的第一个元素。:last:选择每个集合中的最后一个元素。:even:选择索引为偶数的元素。:odd:选择索引为奇数的元素。:gt(n):选择集合中索引大于 n 的元素。:lt(n):选择集合中索引小于 n 的元素。:eq(n):选择集合中索引等于 n 的元素。:not(selector):选择不匹配指定选择器的所有元素。:gt(n):选择集合中索引大于 n 的元素。:lt(n):选择集合中索引小于 n 的元素。:eq(n):选择集合中索引等于 n 的元素。过滤选择器::first-child:选择每个集合中的第一个子元素。:last-child:选择每个集合中的最后一个子元素。:only-child:选择每个集合中唯一的子元素。:nth-child(n):选择每个集合中索引为 n 的子元素。:nth-last-child(n):选择每个集合中倒数第 n 个子元素。

例如,$("#myDiv .myClass") 选择 ID 为 myDiv 的元素内所有类名为 myClass 的元素。

列举基本选择器,层次选择器,属性选择器代码语言:javascript代码运行次数:0运行复制

jQuery 选择器示例

This is a paragraph.

This is a unique paragraph.

This is a highlighted paragraph.

  • List item 1
  • List item 2

This is another paragraph.

  • List item A
  • List item B

This is a link.