1.#ID :根据给定的ID匹配元素
P id='myId '这是第一个p标记/pp id='not '这是第二个p标记/PS script type=' text/JavaScript ' $(function(){ $(' # myId ')。CSS('颜色','红色');});/script结果:
这是第一个P标签
这是第二个P标签
2.元素:根据给定的元素标签名匹配所有元素
Div这是div标记1/divdiv这是div标记2/divp这是p标记/pscript type=' text/JavaScript ' $(function(){ $(' div ')。CSS('颜色','红色');});/script结果:
这是div标签1
这是div标签2
这是P标签
3.class:根据给定的css类名匹配元素
P class='myClass '这是第一个p标记/pp class='not '这是第二个p标记/PS script type=' text/JavaScript ' $(function(){ $(')。my class’)。CSS('颜色','红色');});/script结果:
这是第一个P标签
这是第二个P标签
4.* :匹配所有元素,主要用于结合上下文进行搜索
p这是p标记/pdiv这是div标记/div脚本类型=' text/JavaScript ' $(function(){ $(' * ')。CSS('颜色','红色');});/script结果:
这是P标签
这是div标签
5.多个选择器选择1、选择2、选择3360指定任意数量的选择器,并将匹配的元素合并成一个结果
p类='myP '这是第一个p标记/pp类='not '这是第二个p标记/pDiv id='myDiv '这是第一个div标记/divdiv id='not '这是第二个div标记/div脚本类型=' text/JavaScript ' $(function(){ $(' p . });/script结果:
这是第一个P标签
这是第二个P标签
这是第一个div标签
这是第二个div标签
6.祖先后代:匹配给定祖先元素下的所有后代元素
Div span这是第一个span标记/span p span这是第二个span标记/span/p/div脚本类型=' text/JavaScript ' $(function(){ $(' div span ')。CSS('颜色','红色');});/script结果:
这是第一个span标签
这是第二个跨度标记
7.父子:匹配给定父元素下的所有子元素
Div span这是第一个span标记/span p span这是第二个span标记/span/p/div脚本类型=' text/JavaScript ' $(function(){ $(' div span ')。CSS('颜色','红色');});/script结果:
这是第一个span标签
这是第二个跨度标记
8.prev next :匹配紧接在prev元素之后的所有下一个元素
Div/divp这是第一个p标记/pp这是第二个p标记/PS script type=' text/JavaScript ' $(function(){ $(' div p ')。CSS('颜色','红色');});/script结果:
这是第一个P标签
这是第二个P标签
9.prev ~兄弟:匹配prev元素后的所有兄弟元素
p这是第一个p标记/pdiv p这是第二个p标记/p/divp这是第三个p标记/pscript type=' text/JavaScript ' $(function(){ $(' div ~ p ')。CSS('颜色','红色');});/script结果:
这是第一个P标签
这是第二个P标签
这是第三个P标签
10.first :获取第一个元素
Div p这是第一个p标记/p p这是第二个p标记/p p这是第三个p标记/p/div脚本类型=' text/JavaScript ' $(function(){)