jquery,选择器选择器的意义就是将众多html代码中准确的找出我们想找的单元。
接下来将常见的选择器以及作用列举出来。 基本选择器
$('#test1').css('background' , 'gray');可以找到id = test1的单元。$('p').css('background' , 'blue');所有的P标签都会被选中。 $('.test2').css('background' , 'green');Class = test2的单元全部被选中。 $('*').css('background','pink');*指的就是所有元素，慎用。层次选择器 $('div span').css('background' , 'orange');div下的span将全部选中<div><span>www.zixue.it</span></div><div><p><span>www.itbool.com</span></p></div>这样的也会被选中$('p ~ span').css('background' , 'gray');<div><p></p><span>www.itbool.com</span></div>像这样的span和P属于同一级别。将被选中。基础过滤器
例： <ul><li> 导航 1</li><li> 导航 2</li><li> 导航 3</li><li> 导航 4</li><li> 导航 5</li><li> 导航 6</li></ul> 例如这样的，你想细致到具体的某一个。则需要加上特殊的说明 $('li:first').css('background','red');找第 1 个 $('li:odd').css('background','blue');找第奇数个 , 从 0 计数这里有一个细节，就是我们通常认为的第一个，在这里认为成第0个，就是说如果用这个的话，则是我们经常输出来的2 4 6 8个将被选中。换成even则是选出所有偶数的li了 $('li:eq(2)').css('background' , 'purple');同上选出第二个，就是我们通常所属的第三个。 内容过滤器 可以通过内容找到要找的目标 $('td:contains(" 女 ")').css('background' , 'blue');可以选出内容是女的单元 但是不会选出 这样的 $('td:empty').css('background' , 'green');Empty是空的意思，所以内容为空的都会选出来，但是，如果内容内有空格的话，就不会选中了 $('td:has(span)').css('background' , 'pink');td里含有某元素的话，就会被找出来。 被选中的，则整个td都会被选中。比如这样的 <td><span>22</span><p>11</p>24</td> 不是改变span而是改变td这个单元。 $('p:parent').css('background' , 'black');单元里面有东西的都会被选中，但是空格不算。 表单类型过滤器 $('input[type="text"]').css('background' , 'gray');$('input:text').css('background' , 'blue');这两个是一个性质的 选中input里的type属性作为目标。 其他属性password则替换text就可以了同理。 可见性过滤器 $('div:hidden').css('display','block');利用触发器，可以选中原本display属性为hidden的div。 子元素过滤器 $('p:last-of-type').css('background','gray');可以选中同一级别下最后一个P标签。 <div><p>a</p><p>b</p></div> 这样的话，含有b的p标签就会被涂上颜色。 特殊情况 <div></div><div class='a1'><div></div><div></div><div class='a2'></div></div> 两个有class名的div会被产生作用。 $('li a:only-child').css('background','blue')匹配 li 下作为独生子的 a 标签。例如 <li><a href=""> 导航 </a></li> 不能有其他标签，但是可以有内容。 以上所述是小编给大家介绍的jQuery常见的选择器及用法介绍，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对wanshiok.com网站的支持！
jquery,选择器
|
