jquery选择器

1：基础选择器

/*基础选择器*/$("#one").css("background","#bbffaa"); //改变id为one的元素的背景色$(".mini").css("background","red");//改变class为.mini的元素的背景色$("div").css("background","blue");//改变所有div元素的背景色//$("*").css("background","yellow");//改变所有元素的背景色$("span,#two").css("background","#bbffaa");//改变所有span元素和id为two的元素的背景色

2：层次选择器

/*层次选择器*/$("body div").css("background","#bbffaa");//改变body里所有div的背景色$("body > div").css("background","red");//改变body内子div元素的背景色$(".one + div").css("background","green");//改变class为.one的下一个div元素的背景色   等价于$(".one").next("div");$("#two ~ div").css("background","#FF0066");//改变id为two的元素后面的所有div兄弟元素的背景色//$("#two").siblings("div")  不受前后顺序先知，获取所有同辈的节点

3：过滤选择器

/*过滤选择器*///基础过滤选择器$("div:first").css("background","green"); //改变所有div中第一个div的背景色$("div:last").css("background","red"); //改变所有div中最后一个div的颜色$("div:not(.one)").css("background","red");//改变class不是one的div元素的颜色$("div:even").css("background","#000000");//改变索引值为偶数的div元素的背景色$("div:odd").css("background","#FFFFFF");//改变索引值为奇数的div元素的背景色$("div:eq(3)").css("background","#4b0082");//改变索引值等于3的div元素的背景色$("div:gt(3)").css("background","#FFFFFF");//改变索引值大于3的div元素的背景色$('div:lt(3)').css("background","#4b0082");//改变索引值小于3的div元素的背景色$(':header').css("background","#bbffaa");//改变书喲有标题元素，例如<h1><h2>...这些$(':animated').css("background","#bbffaa");//改变当前正在执行动画的元素的背景色//内部过滤器$("div:contains(in)").css("background","red");//改变含有文本in的div元素的背景色    好像中文不支持呀  用到时  百度$('div:empty').css("background","#4b0082");//改变不包含子元素或者文本为空的元素$('div:parent').css("background","#000000");//改变包含子元素或文本的div$('div:has(.mini)').css("background","red")//改变含有class为.mini元素的div元素的背景色//可见性过滤选择器$(':hidden').css("background","red");//改变所有不可见元素的背景色$('div:hidden').show(3000);//显示隐藏的div元素     $('input:hidden')//$(':visible').css("background","red");//改变所有可见元素的背景色//$('div:visible')  $('input:visible')//属性过滤选择器//$('div[title]').css();//改变含有属性title的div原色的背景色  这里可以使title属性、id属性、name属性等等//$('div[title=test]').css();//改变属性title值等于test的div元素的背景色//$('div[title!=test]').css();//改变属性title值不等于test的div元素的背景色//$('div[title^=te]').css();//改变属性title值以te开始的div元素的背景色//$('div[title$=te]').css();//改变属性title值以te结束的div元素的背景色//$('div[title*=es]').css();//改变属性title值含有es的div元素的背景色//$('div[id][title*=es]').css();//改变含有属性id并且属性title值含有es的div元素的背景色    可以一层层递增//子元素过滤选择器//$('div.one :nth-child(2)').css();//改变每个class为one的div父元素下的第2个子元素的背景色/** :nth-child(even)     能够选取每个父元素下的索引值是偶数的元素* :nth-child(odd)      能够选取每个父元素下的索引值是奇数的元素* :nth-child(3n)       能够选取每个父元素下的索引值是3的倍数的元素(n从0开始)* :nth-child(3n+1)     能够选取每个父元素下的索引值是3n+1的元素(n从0开始)* *///$('div.one :first-child').css();//改变每个class为one的div父元素下的第1个子元素的背景色//$('div.one :last-child').css();//改变每个class为one的div父元素下的最后1个子元素的背景色//$('div.one :only-child').css();//如果class为one的div父元素下只有一个子元素，那么则改变这个子元素的背景色/** eq(index)只匹配一个元素，而:nth-child将为每一个符合条件的父元素匹配子元素  eq(index)是从0开始 :nth是从1开始* */

4：表单选择器

//表单属性过滤选择器$('#form1 input:enabled').val("改变可用input值了");//改变表单内容可用的input值$('#form1 input:disabled').val("改变不可用input值了");//改变表单内容不可用的input值//alert($('input:checked').length);//获取多选框选中的个数//alert($('select :selected').text());//获取下拉框选中的内容/** :input* :text   获取所有单行文本* :password* :radio* :checkbox* :submit* :image* :reset   获取所有的重置按钮* :button* file    获取所有的上传域* */