2.20-jQuery选择器

基本选择器

// 基本选择器
// 1.选择id为one的元素
$('#one').css('background-color','#bfa');
// 2.选择class为mini的元素
$('.mini').css('background-color','#bfa');
// 3.选择元素名是div的元素
$('div').css('background-color','#bfa');
 4.选择所有的元素
$('*').css('background-color','#bfa');
// 5.选择所有的span元素和id为two的元素
 $('span,#two').css('background-color','#bfa');

// 层次选择器
// 1.选择body内的所有div元素
  $('body div').css('background-color','#bfa');
 // 2. 在body内,选择子元素是div的。
$('body > div').css('background-color','#bfa');
 // 3. 选择 所有class为one 的下一个div元素.
 $('.one + div ').css('background-color','#bfa');
// 4.选择 id为two的元素后面的所有div兄弟元素.
$("#two ~ div")

/*基本过滤选择器
 // 1.选择第一个div元素.
$("div:first")
 // 2.选择最后一个div元素.
$("div:last")
// 3.选择class不为one的 所有div元素.
$("div:not(.one)")
// 4.选择索引为偶数的div元素.
$("div:even")
// 5.选择索引为奇数的div元素.
 $('div:odd').css('background-color','#bfa');
// 6.选择索引值为3的元素.
 $('div:eq(3)')
 // 7.选择索引值大于3的元素.
$('div:gt(3)')
 // 8.选择索引值小于3的元素.
$('div:lt(3)')
//9.选择所有标题元素
 $(':header')
11.选择当前获取焦点的所有元素.
 $(':focus')

// 内容过滤选择器
// 1. 选择含有文本“di”的div元素.
$("div:contains(di)")
//2. 选择不含有子元素(或者文本元素)的div空元素.
$("div:empty")
//3 选取含有class为mini元素 的div元素.
$("div:has(.mini)")
// 4 选取含有子元素(或者文本元素)的div元素
$("div:parent")


// 属性选择器
// 1.选取含有 属性title 的div元素.
$("div[title]")
// 2. 选取 属性title值等于“test”的div元素.
$("div[title='test']")
// 3.选取 属性title值不等于“test”的div元素(没有属性title的也将被选中)
$("div[title!='test']")
4.选取 属性title值 以“te”开始 的div元素.
  $("div[title^='te']")
// 5.选取 属性title值 以“est”结束 的div元素.
$("div[title$='te']")
 // 6.选取 属性title值 含有“es”的div元素.
 $("div[title*=es]")
 // 7.组合属性选择器,首先选取有属性id的div元素，然后在结果中 选取属性title值 含有“es”的元素.
 $("div[id][title*=es]")

<!-- 
$('body div')：
这个选择器会选择 body 内部的所有 div 元素，
不管它们的层级结构如何，也就是说，所有的 div，
即使它们被其他元素包裹或嵌套。

$('body > div')：
这个选择器只会选择 body 直接子元素中的 div。
也就是说，只有 body 下面的第一层 div 被选中，
嵌套的 div 不会被选中。

:has()：
这个选择器用来选择包含指定元素的元素。
例如，$('tr:has(td:has(:checkbox:enabled))') 
会选择那些包含至少一个启用的复选框的行（tr）。
它和前面的两个选择器不同的是，
它不是根据层级结构来选择元素，
而是根据元素内部是否包含特定条件的元素来进行筛选。

总结：

$('body div')：选择所有 div 元素。
$('body > div')：只选择 body 下的直接 div 子元素。
:has()：选择包含特定元素的元素，适用条件比较特定的场景。 -->