当前位置:首页 > jquery

jquery 选中

2026-03-02 10:46:24jquery

jQuery 选中元素的方法

使用 jQuery 选中元素主要通过选择器实现,类似于 CSS 选择器。以下是一些常见的选中元素的方法:

基本选择器

  • $("tagName"):选中指定标签名的元素,例如 $("div") 选中所有 <div> 元素。
  • $("#id"):选中指定 ID 的元素,例如 $("#header") 选中 ID 为 header 的元素。
  • $(".className"):选中指定类名的元素,例如 $(".menu") 选中所有类名为 menu 的元素。

层级选择器

jquery 选中

  • $("parent > child"):选中直接子元素,例如 $("ul > li") 选中 <ul> 下的直接 <li> 子元素。
  • $("ancestor descendant"):选中后代元素,例如 $("div p") 选中 <div> 内所有 <p> 元素。

属性选择器

  • $("[attribute]"):选中包含指定属性的元素,例如 $("[href]") 选中所有带有 href 属性的元素。
  • $("[attribute='value']"):选中属性值等于指定值的元素,例如 $("[type='text']") 选中所有 typetext 的元素。

表单选择器

jquery 选中

  • $(":input"):选中所有表单元素(<input>, <select>, <textarea>, <button>)。
  • $(":text"):选中所有 type="text"<input> 元素。
  • $(":checked"):选中所有被选中的复选框或单选按钮。

jQuery 选中元素的示例代码

// 选中所有段落元素并设置红色文本
$("p").css("color", "red");

// 选中 ID 为 "myDiv" 的元素并隐藏
$("#myDiv").hide();

// 选中类名为 "highlight" 的元素并添加边框
$(".highlight").css("border", "1px solid black");

// 选中所有复选框并禁用
$(":checkbox").prop("disabled", true);

链式操作

jQuery 支持链式操作,可以在选中元素后连续调用多个方法:

$("#myButton")
  .css("background", "yellow")
  .attr("disabled", "disabled")
  .text("Click me!");

筛选选中元素

选中一组元素后,可以通过筛选方法进一步缩小范围:

  • $("li").first():选中第一个 <li> 元素。
  • $("div").last():选中最后一个 <div> 元素。
  • $("p").eq(2):选中索引为 2 的 <p> 元素(从 0 开始计数)。
  • $("input").not(":checked"):选中所有未选中的 <input> 元素。

遍历选中元素

使用 .each() 方法遍历选中的元素:

$("li").each(function(index) {
  console.log(index + ": " + $(this).text());
});

标签: jquery
分享给朋友:

相关文章

jquery和vue的区别

jquery和vue的区别

jQuery 和 Vue.js 的区别 jQuery 和 Vue.js 是两种不同的前端技术,分别适用于不同的场景和开发需求。以下是它们的主要区别: 设计理念 jQuery 是一个轻量级的 Java…

jquery作用

jquery作用

jQuery的作用概述 jQuery是一个快速、简洁的JavaScript库,主要用于简化HTML文档遍历、事件处理、动画设计和Ajax交互等操作。其核心目标是让开发者以更少的代码完成更多功能,同时解…

jquery 获取

jquery 获取

jQuery 获取元素的方法 jQuery 提供了多种方法来获取 DOM 元素,以下是常用的几种方式: 通过 ID 获取元素 使用 $("#id") 可以获取指定 ID 的元素。例如: $("…

jquery点击

jquery点击

jQuery 点击事件绑定方法 使用 jQuery 绑定点击事件可以通过多种方式实现,以下是几种常见的方法: click() 方法绑定 $("#elementId").click(function…

jquery添加

jquery添加

jQuery 添加元素的方法 在jQuery中,添加元素到DOM有多种方式,可以根据需求选择合适的方法。 append() 将内容插入到选定元素的内部末尾处。 $("#container").…

jquery属性

jquery属性

jQuery 属性操作 jQuery 提供了多种方法来操作 HTML 元素的属性。这些方法可以用于获取、设置、修改或删除元素的属性。 获取属性值 使用 attr() 方法可以获取指定属性的值。例如,…