详解jQuery选择器

2020-05-24 21:42:20易采站长站整理

选取class是one的下一个<div>同辈元素

$('.one + div');

选取class是one的后面的所有的<div>同辈元素

$('.one ~ div');

过滤选择器

1、基本过滤选择器

选取所有<div>元素中第一个<div>元素

$('div:first');

选取class不是one的<div>元素

$('div:not(.one)');

选取索引是偶数的的<div>元素

$('div:even');

选取索引等于2的<div>元素

$('div:eq(2)');

选取索引大于2的<div>元素

$('div:gt(2)');

选取所有标题元素,例如h1、h2等

$(':header');

选取当前正在执行动画的所有元素

$(':animated');

选取获取当前焦点的元素

$(':focus');

2、内容过滤选择器

选取含有文本“坚持”的<div>元素

$('div:contains('坚持')');

选取不包含子元素或者文本的<div>元素

$('div:empty');

选取含有<p>元素的<div>元素

$('div:has(p)');

选取含有子元素或者文本的元素

$('div:parent');

3、可见性过滤选择器

选取所有不可见的元素。包括<input type=”hidden” />,<div style=”display:none”>和<div style=”overflow:hidden”>

$(':hidden');

选取所有可见的<div>元素

$('div:visible');

4、属性过滤选择器

选取有id属性的元素

$('div[id]');

选取id等于myId的<div>元素

$('div[id="myId"]');

选取id值不等于myId的<div>元素

$('div[id!="myId"]');

选取id值以my开头的<div>元素

$('div[id^="my"]');

选取id值以my结尾的<div>元素

$('div[id$="my"]');

选取id值含有my的<div>元素

$('div[id*="my"]');

选取属性title等于en或者以en为前缀(en后跟一个连字符’-‘)的元素