層級選擇器

1、ancestor descendant （后代選擇器）

• 在給定的祖先元素下匹配所有的后代元素
  
• $(“form input”)
  
• $('.div span')選取<div>里的所有的<span>元素
  

2、parent child （子選擇器）

• 在給定的父元素下匹配所有的子元素
  
• $(“form > input”)
  
• $('.div > span')選取<div>元素下元素名是<span>的子元素
  

3、prev next（臨近選擇器）

• 匹配所有緊接在 prev 元素后的 next 元素
  
• $(“label + input”)
  
• $('.one + div')選取class為one的下一個<div>元素
  

4、prev sibling

• 匹配 prev 元素之后的所有 siblings 元素
  
• $(“prev ~ input”)
  
• $('.one + div')選取class為one的下一個<div>元素
  
• $('#two ~ div')選取id為two的元素后面的所有的<div>兄弟元素

等價關系

1、同等關系

選擇器：$(‘.one + div’)

方法：$(‘.one’).next(‘div’);

2、同等關系

選擇器：$(‘#pre ~ div’)

方法：$(‘#pre’).nextAll(‘div’);

方法：$(‘#pre’).nextAll();

方法：$(‘#pre’).siblings();

3、同等關系

$(‘div’).is(':checked')

$(‘div’).attr('checked') == 'checked'