jquery--选择器
一 . jquery基本選擇器，語法
1.$('#id名')根據給定的id來匹配到元素
2.$('.class名')根據給定的class來匹配到元素
3.$('element')根據給的的標籤名來匹配到元素
4.$('*')匹配所有元素
5.$('#id,.class名,element')匹配到頁面中多個選擇器
ex;
$(document).ready(function(){
$('#box').css('background','green');
$('.box').css('background','yellow');
$('span').css('font-size','30px');
$('*').css('font-family','宋體');
$('#box, .box,span').css('color','pink');
二 .層級選擇器（相當於父類和子類的元素關係）
1.給的的父級元素下匹配所有的子元素:$('父級元素>子級元素')
2.給的祖先元素下匹配所有的後代元素:$('祖先元素 後代元素')
3.匹配緊跟在prev元素後面的Next元素:$('prev+next')(同級的元素)
4.匹配prev元素後面所有元素的siblings元素:$('prev~siblings')
ex;
$(document).ready(function(){
$('ul>li').css('list-style','none');
$('ul li').css('list-style','none');
$('input+button').css('height','50px');
$('label~input').css('background','red');
})
三 .順序選擇器
1.順序
$(':first')第一個元素
$(':last')最後一個元素
2.比較(x的順序是從0開始)
$(':gt(x)')表示大於值x的元素
$(':lt(x)')表示小於值x的元素
$(':eq(x)')表示等於值x額元素
3.奇偶數
$(':odd')奇數順序
$(':even')偶數順序
4.非
$(':not(selector)')匹配不是selector的所有元素
ex;
$('p:first').css('color','red');//匹配第一個元素
$('p:last').css('color','green');//匹配第2個元素
$('p:gt(1)').css('font-size','30px');
$('p:lt(2)').css('color','red');
$('p:eq(1)').css('color','red');
$('p:odd').css('background','#ccc');
$('p:even').css('background','plum');
$('p:not(#box)').css('background','red')
四 .內容選擇器
語法:
$(':contains(text)')匹配包含給定義本（text）的元素
$(':has(selecor)')匹配包含特定選擇器元素的元素
$(':empey')匹配不含有內容的元素（即不包含子元素或者文本的空元素）
$(':parent')匹配含有子元素或者文本的元素
ex;
$(document).ready(function(){
$('div:contains(ss)').css('background','blue');
$('div:has(span)').css('color','yellow');
$('div:empty').css('background','green');
$('div:parent').css('background','plum');
五 .屬性選擇器
語法：
$('[attribute]')匹配包含給定屬性的元素
$('[attribute=value]')匹配包含給定屬性是某個特定值的元素
$('[attribute!=value]')匹配所有不含有指定值的屬性或者說是屬性不等於特定值的元素
$('[attribute]^=value')匹配給定屬性是以某些值開始的元素
$('[attribute]$=value)匹配給定屬性是以某些值結尾的元素
$('[attribute]*=value')匹配給定屬性包含某些值的元素
$('attrsel[1] attrsel[1] attrsel[1]')符合選擇器，需要同時滿足多個條件時使用
ex;
$(document).ready(function(){
$('input[type]').css('background','red');
$('input[type=button]').css('background','blue');
$('input[type!=text]').css('background','yellow');
$('input[type^=b]').css('background','plum');//type值是以b開頭的'button'
$('input[type $=t]').css('background','yellow');//type值是以t結尾'text'
$('input[type*=o]').css('background','yellow');//type值包含o,'button'
$('input[id][name*=n]').css('background','black');
六 .表單選擇器
語法：
$(':enabled')所有激活的Input元素（可以使用的Input元素）
$(':disabled')所有禁用的Input元素（不可以使用的Input元素）
$(':selected')所有被選取的元素，針對於select元素
$(':checked')所有被選中的Input元素
ex;
$(document).ready(function(){
$(':enabled').css('background','red');
$(':disabled').css('background','green');
$(':selected').css('color','plum');
$(':checked').parent().css('color','red');
老师，不好意思，本人来自台湾，已经尽力再使用简体语法了，希望谅解！