$(function(){//alert('a');///基本選擇器//id選擇器//$("#div1").css("background","red");//class選擇器//$(".p1").css("color","red");//標簽選擇器//$("p").css("color","red");//并集選擇器//$("p,li").css("color","red");//全局選擇器//$("*").css("color","red");///層次選擇器//1.后代選擇器//$("#div2 ul").css("color","red");//2.子選擇器//$("#div2>p").css("color","red");//3.相鄰選擇器//$(".p1+p").css("color","red");//4.同輩元素//$(".p1~p").css("color","red");///屬性選擇器//1.包含給定屬性選擇器的元素//獲取所有含有name屬性的元素，顏色設置為紅色//$("[name]").css("color","red");//2.name的值等于name的變成紅色//$("[name='name']").css("color","red");//3.name的值不是name的變成紅色//$("[name!='name']").css("color","red");//4.name的值以p開頭的變成紅色//$("[name^=p]").css("color","red");//5.name的值以e結尾的顏色變成紅色//$("[name$=e]").css("color","red");//6.2019年6月21日11:38:40//name的值中包含e的字體顏色變紅//$("[name*=e]").css("color","red");//7.選取含有id屬性，并且name的值中包含e的元素，，字體顏色變成紅色//$("[id][name*=e]").css("color","red");///過濾選擇器//1.將第一個li變成紅色//$("li:first").css("color","red");//2.將最后一個li變成紅色//$("li:last").css("color","red");//3.選取class不是p1的元素變成紅色//$("li:not(.p1)").css("color","red");//4.所有li的索引是偶數的背景色換一下//$("li:even").css("background","red");//5.所有li的索引是奇數的背景色換一下//$("li:odd").css("background","red");//6.索引等于2的li變成紅色//$("li:eq(2)").css("color","red");//7.索引大于1的li變色//$("li:gt(1)").css("color","red");//8.索引小于2的li變色//$("li:lt(2)").css("color","red");//9.所有的標題元素變成紅色//$(":header").css("color","red");///可見性過濾器//1.所有可見元素變色//$(":visible").css("color","red");//2.將隱藏的元素變色$("h3").hide();$(":hidden").css("color","red");})

總結

以上是生活随笔為你收集整理的jQuery选择器案例之——index.js的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。