html模組如下：
id為one，class為one的div
class為mini
id為two，class為one，title為test的div
class為mini,title為other
class為mini,title為test
class為mini
class為mini
class為mini
class為mini
class為mini
class為mini
class為mini,title為tesst
style的display為「none」的div
class為hide的div
包含input的type為"hidden"的div
正在執行動畫的span元素
css模組如下：
/*全域性樣式設定*/
body,h4,ul,li
/*具體設定*/
div,span,p
div.mini
div.hide
#box
jquer選擇器：
$(function()
//基本選擇器：通過元素id、class和標籤名來等來查詢dom元素。
$('#one').css('background','red'); //改變id為one 的元素的背景色
$('.mini').css('background','blue'); //改變class為mini 的所有元素的背景色
$('div').css('background','green'); //改變元素名是的所有元素的背景色
$('*').css('background','yellowgreen'); //改變所欲元素的背景色
$('span,#two').css('background',"red"); //改變所有元素和id為two的元素的背景色
//層次選擇器：通過dom元素之間的層次關係來獲取特定元素
$('body div').css('background','cornflowerblue'); //改變內所有的背景色
$('body >div').css('background','darkgoldenrod'); //改變內子元素的背景色
$('.one +div').css('background','cadetblue'); //改變class為one的下乙個同輩元素的背景色
$('#two ~div').css('background','darkgreen'); //改變id為two的元素後面的所有同輩元素的背景色//過濾選擇器——基本過濾選擇器：通過特定的過濾規則來篩選所需的dom元素，其語法規則與css中的偽類選擇器語法相同。$('div:first').css('background',"#0000a2"); //改變第乙個元素的背景色
$('div:last').css('background','#316ba5'); //改變最後乙個元素的背景色
$('div:not(.one)').css('background','#468847'); //改變class不為one的元素的背景色
$('div:even').css('background','#990000'); //改變索引值為偶數的元素的背景色
$('div:odd').css('background','brown'); //改變索引值為奇數的元素的背景色
$('div:eq(4)').css('background','goldenrod'); //改變索引值為4的元素的背景色
$('div:gt(4)').css('background','chartreuse'); //改變索引值大於4的元素的背景色
$('div:lt(4)').css('background','darkgreen'); //改變索引值小於4的元素的背景色
$(':header').css('background','yellowgreen'); //改變所有的標題元素，例如,,....這些元素的背景色
$(':animated').css('color','red'); //改變當前正在執行動畫的元素的背景色
$(':focus').css('color','darkred'); //改變當前獲取焦點的元素的背景色
//內容過濾選擇器：過濾規則主要體現在它所包含的子元素或文字內容上。
$("div:contains('di')").css(); //改變含有文字「di」的元素的背景色和文字顏色
$('div:empty').css('background','darkgoldenrod'); //改變不包含子元素（包括文字元素）的空元素的背景色
$('div:has(".mini")').css('background',"#000099"); //改變class為mini元素的元素的背景色
$('div:parent').css('background','green');
//可見性過濾選擇器：根據元素的可見和不可見狀態來選擇相應的元素
$('div:visible').css(); //改變所有可見的元素的背景色
$('div:hidden').show(5000); //顯示隱藏的元素（show(5000)是顯示元素，5000是指元素從隱藏到顯示完成的時間，單位是毫秒）
//屬性過濾選擇器：通過元素的屬性來獲取相應的元素
$('div[title]').css('background','darkgreen'); //改變還有title屬性的元素的背景色
$('div[title=test]').css('background','royalblue'); //改變title值等於"test"的元素的背景色
$('div[title!=test]').css('background','red'); //改變title值不等於'test'的元素的背景色
$('div[title^="en"]').css('background','burlywood'); //改變title值以'en'開始的元素的背景色
$('div[title$="en"]').css('background','red'); //改變title值以'en'結束的元素的背景色
$('div[class*=one]').css('background','greenyellow'); //改變class值為'one'的元素的背景色
$('div[title|="en"]').css('background','red'); //改變class值為'en'或以'en'為字首的元素的背景色（字首是指類似於mi-ni這樣的屬性）
$('div[title~=en]').css('background','red'); //改變屬性class用空格分隔的值中包含'en'的元素的背景色（類似於mi ni這樣的屬性）
$('div[id][title^=t]').css('background','goldenrod'); //改變含有屬性id且title值以t開頭的元素的背景色
//子元素過濾選擇器：根據元素之間的父輩與子輩的關係來獲取相應的元素
$('div.one :nth-child(1)').css('background','darkgoldenrod'); //改變每個class為one的父元素下的第2個子元素的背景色
$('div.one :first-child').css('background','royalblue'); //改變每個class為one的父元素下的第1個子元素的背景色
$('div.one :last-child').css('background','darkgoldenrod'); //改變每個class為one的父元素下的最後1個子元素的背景色
$('div.one :only-child').css('background','mediumvioletred'); //如果class為one的父元素下只有乙個子元素，那麼則改變這個子元素的背景色
});
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 la...
JQuery選擇器 選擇器簡介
在開始學習jquery選擇器之前，有必要了解一下css 層疊樣式表 技術。css是一項出色的技術，它使得網頁的結構和表現樣式完全分離。利用css選擇器能夠輕鬆的對某個元素新增樣式而不改變html結構，只需通過新增不同的css規則，就可以得到各種不同樣式的網頁。常用的css選擇器分類如下表 選擇器語法...
Jquery選擇器 基本選擇器
jquery作為我們常用前端工具之一，實際專案中常用的的選擇器有id選擇器 id 元素選擇器 element 樣式選擇器 class 概述 根據給定的id匹配乙個元素。使用任何的元字元 如 作為名稱的文字部分，它必須被兩個反斜槓轉義 引數 id,用於搜尋的，通過元素的 id 屬性中給定的值。示例 查...