Jquery 選擇器 簡單的選擇器

1.3簡單的偽類選擇器

你們好

你們好

你們好你們好
你們好你們好

1.3.1特定位置選擇器

主要包括：first ，last，eq（index）3中位置

$("p:first").css("color","blue")//匹配第乙個p標籤

$("p:eq(3)").css("background","yellow")//匹配第4個p標籤
$("p:last").css("color","red");//匹配最後乙個p標籤

1.3.2制定範圍選擇器

主要包括：even，odd, gt(index), it(index)4個範圍

$("p:even").css("background","red")//匹配偶數行p標籤

$("p:odd").css("background","blue")//匹配所有奇數行p標籤
$("p:gt(2)").css("background","blue")//匹配大於索引值的元素
$("p:lt(2)").css("background","blue")//匹配小於索引值的元素

匹配元素集合中排除符合特定匹配規則的元素

$("p:not(p:first)").css("background","blue")

1.4與內容相關的為類選擇器

1.4.1匹配包含文字選擇器

能夠根據指定的文字在所能夠匹配的元素集合中搜尋包含特定關鍵字的元素

body

你們好

給大家介紹乙個
新朋友，我的
小小豬

$("p:contains('朋友')").css('background',"red");//注意  選中的是標籤裡面的所有內容             contains()文字匹配函式

1.4.2匹配包含元素選擇器

主要搜尋破匹配元素所包含的元素進過濾

$("p:has(a)").css("color","#098")  //匹配p標籤裡面有a標籤的，選中的還是外面那個p標籤

1.4.3包含判斷選擇器

$("p:empty")

$("p:parent")

可以根據元素的課件或者隱藏進行過濾

body

head

$("h1:odd").hide();//隱藏奇數為h1元素

$("h1:odd").css("color","#ff0");//設定奇數字h1元素字型顏色為黃色
$("h1:even").css("color","blue");//設定奇數字h1元素字型顏色為藍色
$("h1:hidden").show();//顯示奇數字的p元

$("h1:first-child").css("background","red")//匹配第乙個h1標籤

$("h1:last-child").css("background","blue")//匹配最後乙個h1標籤
$("h1:nth-child(2)").css("color","red")//匹配第三個h1標籤

注意：nth-child  數字是從1開始算起

1.7與扁擔物件相關的偽類選擇器

body

$("#as:disabled").val("不可用");   //匹配所有不可用元素

$("#as:enabled").val("可用");   //匹配所有可用元素
$("#as:checked").removeattr("checked");//刪除checked屬性
$("#as:selected").removeattr("selected");//刪除selected屬性

1.9與屬性相關的選擇器

$("form[id]").css("background","red");//查詢所有含有id屬性的

$("input[value='按鈕']").css("background","blue");//查詢屬性value等於按鈕的元件
$("input[value!='按鈕']").css("background","yellow");//查詢屬性value等於按鈕的元件
$("input[type^='ra']").css("margin","100px");//查詢屬性type的屬性值以ra開始的
$("input[type$='et']").css("margin","100px");//查詢屬性type的屬性值以et結束的
$("input[type*='as']").css("margin","100px");//查詢屬性type的屬值性中包含as的
$("input[name*='text'][id]").css("margin","100px");//查詢name屬性值以text結尾，並且含有id屬性的

jQuery選擇器之全選擇器（ 選擇器）

在css中，經常會在第一行寫下這樣一段樣式 萬用字元 意味著給所有的元素設定預設的邊距。jquery中我們也可以通過傳遞 選擇器來選中文件頁面中的元素 描述 拋開jquery，如果要獲取文件中所有的元素，通過document.getelementsbytagname 中傳遞 同樣可以獲取到 不難發現...

jQuery選擇器之全選擇器（選擇器）

jquery選擇器之全選擇器 選擇器 在css中，經常會在第一行寫下這樣一段樣式 萬用字元 意味著給所有的元素設定預設的邊距。jquery中我們也可以通過傳遞 選擇器來選中文件頁面中的元素 描述 拋開jquery，如果要獲取文件中所有的元素，通過document.getelementsbytagna...

JQuery選擇器 選擇器簡介

在開始學習jquery選擇器之前，有必要了解一下css 層疊樣式表 技術。css是一項出色的技術，它使得網頁的結構和表現樣式完全分離。利用css選擇器能夠輕鬆的對某個元素新增樣式而不改變html結構，只需通過新增不同的css規則，就可以得到各種不同樣式的網頁。常用的css選擇器分類如下表 選擇器語法...