css选择器(selector) xPath的选择器

作者：佚名字体：[增加减小] 来源：互联网时间：2017-08-06

本文主要包含css选择器,xPath选择器等相关知识,佚名希望在学习及工作中可以帮助到您

去年我学jQuery的时候，曾经做过一点选择器（selector）的笔记。

这几天拿出来看了一下，发现很多都忘记了。所以，我决定把它们贴在这里，方便以后查看。这对其他朋友应该也是有用的，毕竟选择器是制作网页效果的第一步。

笔记分为两个部分，今天是CSS的选择器，以后还有一部分xPath的选择器。今天的笔记中包括44个选择器，基本涵盖了CSS 2和CSS 3的所有规定。

=====================

CSS选择器笔记

一、基本选择器

序号	选择器	含义
1.	*	通用元素选择器，匹配任何元素
2.	E	标签选择器，匹配所有使用E标签的元素
3.	.info	class选择器，匹配所有class属性中包含info的元素
4.	#footer	id选择器，匹配所有id属性等于footer的元素

实例：

序号	选择器	含义
5.	E,F	多元素选择器，同时匹配所有E元素或F元素，E和F之间用逗号分隔
6.	E F	后代元素选择器，匹配所有属于E元素后代的F元素，E和F之间用空格分隔
7.	E > F	子元素选择器，匹配所有E元素的子元素F
8.	E + F	毗邻元素选择器，匹配所有紧随E元素之后的同级元素F

实例：

序号	选择器	含义
9.	E[att]	匹配所有具有att属性的E元素，不考虑它的值。（注意：E在此处可以省略，比如“[cheacked]”。以下同。）
10.	E[att=val]	匹配所有att属性等于“val”的E元素
11.	E[att~=val]	匹配所有att属性具有多个空格分隔的值、其中一个值等于“val”的E元素
12.	E[att\|=val]	匹配所有att属性具有多个连字号分隔（hyphen-separated）的值、其中一个值以“val”开头的E元素，主要用于lang属性，比如“en”、“en-us”、“en-gb”等等

实例：

实例：

实例：

序号	选择器	含义
24.	E ~ F	匹配任何在E元素之后的同级F元素

实例：

相关文章