JavaScript--选择器
1、选择器是jQuery的根基,在jQuery中,对事件处理,遍历DOM和Ajax操作都依赖于选择器。
2、选择的优点:
--写法简洁;
--完善的事件处理机制。
3、基本选择器:
--基本选择器是jQuery中最常用的选择器,也是最简单的选择器,它通过元素id,class和标签名来查找DOM元素(在网页中id只能使用一次,class允许重复使用);
4、层次选择器:
--如果想通过DOM之间的层次关系来获取特定元素,例如后代元素,子元素,相邻元素,兄弟元素等,则需要使用层次选择器;
--$("prev ~ div")选择器只能选择"#prev"元素后面的同辈元素;而jQuery中的方法siblings()与前后位置无关,只要是同辈节点就可以选取;
5、过滤选择器:
--过滤选择器主要是通过特定的过滤规则来筛选出所需的DOM元素,该选择器都以 ":" 开头;
--按照不同的过滤规则,过滤选择器可以分为基本过滤、内容过滤、可见性过滤、属性过滤、子元素过滤和表单对象属性过滤选择器;
--1)基本过滤选择器:
--2)内容过滤选择器:内容过滤选择器的过滤规则主要体现在它所包含的子元素和文本内容上;
--3)可见性过滤选择器:根据元素的可见和不可见状态来选择相应的元素;
--可见选择器:hidden不仅包含样式属性display为none的元素,也包含文本隐藏域(<input type="hidden"/>) 和visible:hidden之类的元素;
--4)属性过滤选择器:通过元素的属性来获取相应的元素
--5)子元素过滤选择器:
--nth-child()选择器详解如下:
--①:nth-child(even/odd):能选取每个父元素下的索引值为偶(奇)数的元素;
--②:nth-child(2):能选取每个父元素下的索引值为2的元素;
--③:nth-child(3n):能选取每个父元素下索引值是3的倍数的元素;
--④:nth-child(3n+1):能选取每个父元素下索引值是3n+1的元素;
--6)表单对象属性过滤选择器:此选择器主要对所选择的表单进行过滤:
--7)表单选择器:
JavaScript--选择器的更多相关文章
- 深入理解javascript选择器API系列第三篇——h5新增的3种selector方法
× 目录 [1]方法 [2]非实时 [3]缺陷 前面的话 尽管DOM作为API已经非常完善了,但是为了实现更多的功能,DOM仍然进行了扩展,其中一个重要的扩展就是对选择器API的扩展.人们对jQuer ...
- jQuery 选择器和JavaScript 选择器的技巧与异常原因
jquery的选择器借鉴了css选择器,核心依然依靠JavaScript的getElementById()和getElementsByTagName()方法,但是他封装了2个方法,让jquery选择器 ...
- 深入理解javascript选择器API系列第三篇——HTML5新增的3种selector方法
前面的话 尽管DOM作为API已经非常完善了,但是为了实现更多的功能,DOM仍然进行了扩展,其中一个重要的扩展就是对选择器API的扩展.人们对jQuery的称赞,很多是由于jQuery方便的元素选择器 ...
- 使用HTML5的JavaScript选择器操作页面中的元素
<!doctype html><html lang="en"> <head> <meta charset="UTF-8& ...
- HTML5的JavaScript选择器介绍
在HTML5出现之前使用JavaScript查找DOM元素,有以下三种原生的方法: getElementById:根据指定元素的id属性返回元素 getElementsByName:返回所有指定nam ...
- JavaScript选择器和节点操作
感谢:链接(视频讲解很清晰) 下文中讲解用到Chrome中的console调试台,如果不懂最好先看一下:链接 JavaScript选择器 作用:选取html中的标签等内容,最重要的还是为节点的操作(增 ...
- 深入理解javascript选择器API系列第二篇——getElementsByClassName
× 目录 [1]使用 [2]classList [3]扩展 前面的话 既然有getElementById()和getElementsByTagName()方法,为什么没有getElementsByCl ...
- 深入理解javascript选择器API系列第一篇——4种元素选择器
× 目录 [1]id属性 [2]标签名 [3]name属性[4]all 前面的话 说到最常见的DOM应用,恐怕就要数取得特定的某个或某组元素的引用了.DOM定义了许多方式来选取元素,包括getElem ...
- javascript选择器querySelector和querySelectorAll的使用和区别
querySelector 和 querySelectorAll 方法是 W3C Selectors API规范中定义的.他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素. 目前几乎主流浏 ...
- 深入学习jQuery选择器系列第八篇——过滤选择器之伪子元素选择器
× 目录 [1]通用形式 [2]反向形式 [3]首尾元素 [4]唯一元素 前面的话 本文是子元素选择器的续篇,主要介绍关于nth-of-type()选择器的内容.该部分内容并非没有出现在<锋利的 ...
随机推荐
- mybatis用mybatis-generator-core-1.3.5.jar自动生成实体类
原文出处:https://blog.csdn.net/shuoshuo_12345/article/details/80626241,本文只是个人总结而已! 方法1:在pom文件中添加依赖 只需在搭建 ...
- 使用命令将单个java文件打包为jar
思路:先将java文件编译为class文件,然后再打包为jar 参考博文:https://www.cnblogs.com/sxdcgaq8080/p/8126770.html http://www.m ...
- 加载Properties配置文件
/** * 加载Properties配置文件 * * @author ZhangHaiNing * @param file 要读取的文件 * @return */ public static Prop ...
- RTT学习之SPI设备
SPI分为主.从.设备:具体又分标准SPI/DUAL SPI/QUAD SPI(用80字节的RAMrt_err_t rt_spi_take_bus(struct rt_spi_device *devi ...
- hive启动报错(整合spark)
spark整合hive后,hive启动报错: ls: cannot access /export/servers/spark/lib/spark-assembly-*.jar: No such fil ...
- 【PAT甲级】1065 A+B and C (64bit) (20 分)(大数溢出)
题意: 输入三个整数A,B,C(long long范围内),输出是否A+B>C. trick: 测试点2包括溢出的数据,判断一下是否溢出即可. AAAAAccepted code: #defin ...
- js 字符串相关函数
https://www.jb51.net/article/74614.htm
- vmware fusion nat网络模式设置固定ip
最近想在本地用虚拟环境搭一个k8s环境,但是发现虚拟机的ip会不定时自动变化,导致mosh客户端连接经常中断.于是就想让虚拟机的ip固定住,不再变动. mac 上的 vmware fusion 设置固 ...
- Win10中小娜无法搜索本地应用
解决方案 1.win+X - Windows PowerShell(管理员) 2. 输入Get-AppXPackage -Name Microsoft.Windows.Cortana | Fo ...
- Lesson 14 The Butterfly Effect
Why do small errors make it impossible to predict the weather system with a high degree of accuracy? ...