<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery-3.1.0.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(document).ready(function(){
过滤选择器
last 选取最后一个元素
var $div = $('#div1 div:last');
console.log($div);
not(selector)除去所有与给定元素的所有匹配的元素
var $div = $(':not(#div1 div:last)');
console.log($div);
:odd 选中下标是奇数的兄弟标签(从0开始)
var $div = $('#div1 div:odd');
console.log($div);
:eq(index) 选取下标为index的元素(从0开始)
var $div = $('div:eq(2)');
console.log($div);
:header 选取所有的标题元素
var $div = $('#div1 *:header');
console.log($div)
:focus 选取当前获取焦点的元素 input 标签中 注意：autofocus
var $div = $('input:focus');
console.log($div);
$div.css('background-color','red')
:contains(text) 内容过滤选择器
var $div = $('p:contains(只)');
console.log($div);
:empty 选取不包含子元素的或文本的空元素
var $div = $('div:empty');
console.log($div);
:parent 选取包含子元素的或文本的空元素
var $div = $('div:parent');
console.log($div);
:nth-child(xn) 从1开始计数 选取每个父元素下的下标为index的元素
var $div = $('div:nth-child(3)');
console.log($div);
:nth- child(xn+1) 从0开始计数
var $div = $('div:nth-child(3n+1)');
console.log($div);
:nth-child(even) 选取父元素下标为偶数的元素 从0开始
var $div = $('div:nth-child(even)');
console.log($div);
:nth-child(odd) 选取父元素下标为奇数的元素 从0开始
var $div = $('div:nth-child(odd)');
console.log($div);
:has(selector) 选取包含匹配选择器的元素
var $div = $('div:has(div)');
console.log($div);
:hidden 选取所有不可见的元素
三种形式： <input type="hidden" />
<div style="display: none;"></div>
<div style="visibility: hidden;"></div>
var $div = $('input:hidden');
console.log($div)
})
</script>
</head>
<body>
<a href=""></a>
<div id="div1">
<div id="div6"></div>
<div class="a"></div>
<div class="b"></div>
<div class="c"></div>
<div class="d"></div>
<h1 class="h1"></h1>
</div>
<div id="div2"></div>
<div id="div3"></div>
<div id="div4"></div>
<div id="div5"></div>
<input type="text" name="name" id="name" value=""
autofocus="autofocus"/>
<input type="hidden" name="" id="" value="" />
<p>一只乌鸦口渴了</p>
<p>到处找水喝</p>
</body>
</html>
