Jquery選擇器介紹

jquery選擇器使得獲得頁面元素變得更加容易、更加靈活，從而大大減輕了開發人員的壓力。如同蓋樓一樣，沒有磚瓦，就蓋不起樓房。得不到元素談何其他各種操作呢？可見,jquery選擇器的重要性。當然想一下子掌握所有選擇器也是很困難的，這個得靠實踐和積累。

現在我們正式進入jquery選擇器的學習。我們將jquery選擇器進行分類學習，將jquery選擇器分為以下幾種：

1、基本選擇器

舉例：

type
="text"id=
"id"
value
="根據id選擇"
/>
根據元素名稱選擇
type
="text"
class
="classname"
value
="根據元素css類名選擇"
/>

jquery

("#id"
).val
();jquery
("a"
).text
();jquery
(".classname"
).val
();

2、層次選擇器

舉例：

id=

"divtest"
>
type
="text"
value
="投資"
/>id=
"next"
type
="text"
/>
type
="text"
value
="擔當"
/>
type
="text"
title
="學習"
value
="學習"
/>12

//得到div中的a標籤內容 結果為12

jquery
("#divtest a"
).text
();//輸出div直接子節點 結果為投資
jquery
("#divtest>input"
).val
();//輸出id為next的後乙個同級別元素 結果為擔當
jquery
("#next+input"
).val
();//同上，並且是有title的元素 結果為學習
jquery
("#next~[title]"
).val
();

舉例：

id=

"divtest"
>

//第乙個li內容 結果為投資

jquery
("li:first"
).text
();//最後乙個li內容 結果為擔當
jquery
("li:last"
).text
();//input未被選中的值 結果為不學習
jquery
("li input:not(:checked)"
).val
();//索引為偶數的li 結果為投資 成熟
jquery
("li:even"
).text
();//索引為奇數的li 結果為理財 擔當
jquery
("li:odd"
).text
();//索引大於2的li的內容 結果為擔當
jquery
("li:gt(2)"
).text
();//索引小於1的li的內容 結果為投資
jquery
("li:lt(1)"
).text
();

舉例：

id=

"test"
>

//包含hyip的li的內容 結果為hyip投資 hyip

jquery
("li:contains('hyip')"
).text
();//內容為空的li的後乙個li內容 結果為理財
jquery
("li:empty+li"
).text
();//包含a標籤的li的內容 結果為投資
jquery
("li:has(a)"
).text
();

舉例：

//不可見的li的內容 結果為不可見

jquery
("li:hidden"
).text
();//可見的li的內容 結果為可見
jquery
("li:visible"
).text
();

舉例：

type
="text"
name
="hyipinvest"
value
="hyip投資"
/>
type
="text"
name
="investhyip"
value
="投資hyip"
/>
type
="text"
name
="google"
value
="hyip"
/>

//name為hyipinvest的值 結果為hyip投資

alert
(jquery
("input[name='hyipinvest']"
).val
());
//name以hyip開始的值 結果為hyip投資
alert
(jquery
("input[name^='hyip']"
).val
());
//name以hyip結束的值 結果為投資hyip
alert
(jquery
("input[name$='hyip']"
).val
());
//name包含oo的值 結果為hyip
alert
(jquery
("input[name*='oo']"
).val
());

jquery 選擇器介紹

jquery 選擇器介紹 基本選擇器 myelement 選擇id值等於myelement的元素，id值不能重複在文件中只能有乙個id值是myelement所以得到的是唯一的元素 div 選擇所有的div標籤元素，返回div元素陣列 myclass 選擇使用myclass類的css的所有元素 選擇文...

JQuery選擇器介紹

在dom程式設計中我們只能使用有限的函式根據id或者tagname獲取dom物件.然而在jquery中則完全不同,jquery提供了異常強大的選擇器用來幫助我們獲取頁面上的物件,並且將物件以jquery包裝集的形式返回。本章主要對常用的jquery選擇器進行乙個介紹及歸類。jquery選擇器大體上可...

jquery概述及選擇器介紹

1.基本功能 2.特點 3.js與jq區別 傳統的方式頁面載入會存在覆蓋問題，載入比jq慢 整個頁面載入完畢 包括裡面的其它內容，比如 jq不存在覆蓋問題，載入的時候是順序執行,載入比js要快！當整個dom樹結構繪製完畢就會載入 b.覆蓋問題 jq 不存在覆蓋,載入時順序執行 js 存在覆蓋,載入時...