/* 基本選擇器 /
/ id選擇器 #id /
/ class選擇器 .class /
/ 標籤選擇器 標籤名 /
/ 並集選擇器 #id,.class,標籤名 /
/ 萬用字元 * */
/* 層級選擇器 /
/ $(".box")獲採樣式為box的標籤 /
/ $(".box div") 獲取class為box的標籤(所有子孫節點)中的div標籤 */
// $(".box div").css(「background」, 「red」);
/* 獲取指定標籤子節點中所有對應的標籤 */
// $(".box > div").css("background", "red");
/* 獲取指定標籤後面的第乙個兄弟節點 */
// $("#testid + div").css("background", "#195");
/* 獲取指定標籤後面的所有的兄弟節點 */
$("#testid ~ div").css("background", "#195");
/* 父子選擇器 */
/*獲取父標籤相關的方法 /
/ [1] parent() 獲取父標籤 /
// $("#testid").parent().css(「border」, 「2px solid #000」);
/ [2] parents() 獲取所有的祖先節點 */
// $("#testid").parents().css(「border」, 「2px solid #000」);
// $("#testid").parents(「div」).css(「border」, 「2px solid #000」);
/* [3]parentsuntil() 獲取 所有的祖先節點(直到某個節點為止) 不包含*/
// $("#testid").parentsuntil("html").css("border", "2px solid #000");
/*獲取子節點相關的方法 */
/* [1] children() 獲取當前標籤所有的子標籤*/
// $(".box").children("span").css("color", "red");
/* [2] siblings() 獲取當前標籤所有的兄弟標籤 */
// $("#testid").siblings().css("color", "red");
/* [3] next() 獲取當前標籤下乙個兄弟節點 */
// $("#testid").next().css("color", "red");
/* [4] prev() 獲取當前標籤上乙個兄弟節點 */
// $("#testid").prev().css("color", "red");
// $("testid").nextall(); //獲取當前標籤後面所有兄弟節點
// $("testid").nextuntil();//獲取當前標籤後面所有兄弟節點(直到...為止)
// $("testid").prevall();
/* 篩選選擇器 /
/ 001-獲取第乙個li標籤 */
// $(「li」).eq(0).css(「background」, 「red」);
// $(「li:eq(0)」).css(「background」, 「red」);
// $(「li:first」).css(「background」, 「#195」);
/* 002-獲取最後乙個li標籤 */
// $("li:last").css("background", "#195");
/* 003-獲取指定索引的li標籤 */
// $("li:eq(3)").css("background", "#195");
/* 004-獲取索引為奇數的所有li標籤 */
/* 004-獲取索引為偶數的所有li標籤 */
// $("li:odd").css("background", "#195");
// $("li:even").css("background", "#f08");
/* 005-獲取索引小於3的索引li標籤 */
/* 005-獲取索引大於5的索引li標籤 */
// $("li:lt(3)").css("background", "#195");
// $("li:gt(5)").css("background", "#195");
/* 006-獲取所有的li標籤除了索引為3的標籤之外 */
$("li:not(:eq(3))").css("background", "#195");
/* first 第乙個 */
/* last 最後乙個 */
/* eq 等於 */
/* not 除了 */
/* lt 小於 */
/* gt 大於 */
/* 屬性選擇器 /
/ 001-根據屬性名來選擇標籤,要選擇擁有href屬性的a標籤 */
// $(「a[href]」).css(「background」, 「red」);
/* 002-根據屬性值來選擇標籤 */
/* [1] 鏈結位址等於 */
// $("a[href='']").css("background", "red");
/* [2] 鏈結位址不等於 */
// $("a[href!='']").css("background", "red");
/* [3] 鏈結位址以https開頭 */
/* [4] 鏈結位址以.cn結尾 */
// $("a[href$='.cn']").css("background", "red");
/* [5] 屬性值包含特定值 */
$("a[href*='baidu'][title='標題']").css("background", "red");
JQuery選擇器 選擇器簡介
在開始學習jquery選擇器之前,有必要了解一下css 層疊樣式表 技術。css是一項出色的技術,它使得網頁的結構和表現樣式完全分離。利用css選擇器能夠輕鬆的對某個元素新增樣式而不改變html結構,只需通過新增不同的css規則,就可以得到各種不同樣式的網頁。常用的css選擇器分類如下表 選擇器語法...
Jquery選擇器 基本選擇器
jquery作為我們常用前端工具之一,實際專案中常用的的選擇器有id選擇器 id 元素選擇器 element 樣式選擇器 class 概述 根據給定的id匹配乙個元素。使用任何的元字元 如 作為名稱的文字部分,它必須被兩個反斜槓轉義 引數 id,用於搜尋的,通過元素的 id 屬性中給定的值。示例 查...
jQuery選擇器之全選擇器( 選擇器)
在css中,經常會在第一行寫下這樣一段樣式 萬用字元 意味著給所有的元素設定預設的邊距。jquery中我們也可以通過傳遞 選擇器來選中文件頁面中的元素 描述 拋開jquery,如果要獲取文件中所有的元素,通過document.getelementsbytagname 中傳遞 同樣可以獲取到 不難發現...