preface

jquery其实就是对javascript的再次封装，方便我们开发者调用，下载地址是： ，下面就说说常用使用方法

选择器

基本选择器

1. 根据id选择

$('#hehe').text(123);

1. 根据html标签选择

$('span').text('hehe');

1. 根据css样式来选择

$('.h1').text('class')

多个标签同时选择

$('#hehe,span,.h1').text('okkk')

层级选择器

• 一级一级往下找。

$('#hehe span .h1 .inp').text('fuck')

• 子级查找,在给定的父元素下匹配所有的子元素

$("form > input")

• 同级查找

console.log($("#prev ~ div").text())

• 查找所有跟在prev的css样式后的div标签。

console.log($('.prev + div').text())

基本筛选

• -eq 找出下标等于指定数的table，下标都是以0开始

    
       
      
       
TD #0
       
TD #1
       
TD #2
      
        
       
TD #3
       
TD #4
       
TD #5
      
        
       
TD #6
       
TD #7
       
TD #8
      
     
    

• :even，找出下标为奇数的表格,即第一行，第二行，第三行，索引值对应的也是0,2,4，这是基于0的索引，所以:even选择器是选择第一个元素，第三个元素，依此类推在匹配。

    
       
      
       
TD #0
       
TD #1
       
TD #2
      
        
       
TD #3
       
TD #4
       
TD #5
      
        
       
TD #6
       
TD #7
       
TD #8
      
     
    

• :odd,找出下标是偶数的标签，即匹配第二行，第四行等等，索引值对应的也是1,3,5....

$('li:odd').css('color','red')

• first,找出指定元素的第一个，等价与:eq(0)和:lt(1)。虽然:first只匹配一个单独的元素，但是:first-child选择器可以匹配多个：即为每个父级元素匹配第一个子元素。

    
     div    
     
       
      
PeKing0
    
     
    
     
       
      
PeKing1
    
     
    
     
       
      
PeKing2
    
     
    
     
       
      
PeKing3
    
     
    

• :gt,找出下标大于指定数的标签

$('.hello ul:gt(1)').css('color','red')

• :head,找出所有的标题标签，如h1,h2,h3等等

$(':header').css('color','green')

• :not,找所有没有被选中多选框

$('input:not(:checked)').css("background-color", "yellow")

检测内容的

• :contains(),用来查找的一个文本字符串。这是区分大小写的。

$("div:contains('John')").css('text-decoration','underline')

• empty,选择所有没有子元素的元素（包括文本节点）

• :has，选择元素其中至少包含指定选择器匹配的一个种元素，如$('div:has(span)')，表示在div下面必须要有span标签才能匹配上，即使span标签不是子级，是更深的级别也行。

• :parent,选择当前元素

$('#fuck:parent').css('background-color','red')

属性

• [key=val]

$('input[checked=checked]')