在使用Jquery进行DOM操作的时候,首先需要获取操作的元素,而选择器就是用来获取元素的工具。选择器可以根据不同的条件进行筛选,选择我们需要的元素。
Jquery实战_读书笔记2 选择器
1. 选择器简介
在使用Jquery进行DOM操作的时候,首先需要获取操作的元素,而选择器就是用来获取元素的工具。选择器可以根据不同的条件进行筛选,选择我们需要的元素。
Jquery中支持多种选择器:标签选择器、ID选择器、class选择器、属性选择器、伪类选择器、层次选择器等。
例如,我们可以使用ID选择器来选择页面中的某个元素,如下:
$("#myId")
2. 常用的选择器
2.1 标签选择器
标签选择器是最常用的选择器之一,可以通过标签名来选择页面中的元素。例如,选择所有的div元素:
$("div")
2.2 ID选择器
ID选择器可以根据元素的ID属性来选择页面中的元素。例如,选择ID为“myId”的元素:
$("#myId")
2.3 class选择器
class选择器可以根据元素的class属性来选择页面中的元素。例如,选择class为“myClass”的元素:
$(".myClass")
2.4 属性选择器
属性选择器可以根据元素的属性来选择页面中的元素。例如,选择所有含有title属性的元素:
$("[title]")
2.5 子元素选择器
子元素选择器可以根据元素的子元素来选择页面中的元素。例如,选择所有class为“myClass”的直接子元素:
$("div > .myClass")
3. 示例说明
3.1 选择所有链接并在点击时添加样式
$("a").click(function(){
$(this).addClass("active");
});
上述代码会选择页面中的所有链接元素,并在点击时添加一个名为“active”的class样式。
3.2 选择所有含有特定属性的图片元素
$("img[src='/images/pic.jpg']")
上述代码会选择所有src属性为“/images/pic.jpg”的图片元素。
4. 总结
选择器是Jquery中非常重要的部分,通过选择器我们可以精准地获取我们需要的元素。掌握好选择器的使用方法,能够帮助我们更加高效地进行DOM操作。
本文标题为:Jquery实战_读书笔记2 选择器


- DIV设置浮动后无法撑开外部DIV的解决办法 2024-02-05
- 详解vue-router 2.0 常用基础知识点之router.push() 2024-01-16
- css clear之清除区域 2024-02-05
- HTML5在线预览PDF的示例代码 2022-09-16
- Bootstrap CSS组件之导航(nav) 2024-01-03
- JS属性scrollTop clientHeight scrollHeight理解学习 2024-01-06
- css控制文字自动换行的实现方法 2024-02-22
- cordova+vue+webapp使用html5获取地理位置的方法 2024-01-17
- 关于Mac系统下wepy运行环境和vue运行环境冲突Error: Vue packages version mismatch:问题的解决方法 2023-08-29
- sql、linq、lambda三种表达方式转换 转自https://www.cnblogs.com/drzhong/p/4393231.html 2023-10-25