免费观看又色又爽又黄的小说免费_美女福利视频国产片_亚洲欧美精品_美国一级大黄大色毛片

jQuery選擇符基礎知識點有哪些

這篇文章主要為大家展示了“jQuery選擇符基礎知識點有哪些”，內容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領大家一起研究并學習一下“jQuery選擇符基礎知識點有哪些”這篇文章吧。

為城關等地區用戶提供了全套網頁設計制作服務，及城關網站建設行業解決方案。主營業務為成都網站建設、成都網站制作、城關網站設計，以傳統方式定制建設網站，并提供域名空間備案等一條龍服務，秉承以專業、用心的態度為用戶提供真誠的服務。我們深信只要達到每一位用戶的要求，就會得到認可，從而選擇與我們長期合作。這樣，我們也可以走得更遠！

其實 jQuery 的選擇符主要是利用了 CSS 和 XPath 選擇符的能力，當然還包括 jQuery的自定義選擇符，從而讓我們在 DOM 樹中能夠方便和靈活的 獲取 各類元素 或者 元素組。

上面提到的三種選擇符類型（CSS，XPath，自定義）在 jQuery 中使用時都是以 $() 函數開始和表示的，該函數稱為 工廠函數。

放置于 $() 中的任何元素都會自動執行循環遍歷，并保存至一個 jQuery 對象中。而$()函數可以使用的參數常用的有：

     + 標簽名，如：$('p')，取得文檔中的所有 段落；

     + ID，如：$('#some-id')，取得文檔中具有對應的 some-id ID 的 一個 元素，如果你使用了同一 some-id 多次，只會取得第一個使用 id="some-id" 的元素；

     + class，如：$('.some-class')，取得文檔中帶有 some-class 的所有元素；

下面對幾種類型的選擇符的使用分別進行總結（主要是貼一些示例）。

1，CSS 選擇符

// 給 id 為 selected-ul 的 ul 元素下的第一級列表元素添加 樣式 horizontal
$('#selected-ul > li').addClass('horizontal');

這里的：

     + > 為 子元素組合符，語法格式為 $('parent > child')，只選擇 parent 的第一代子元素，注意 $('parent child')是包含 parent 下所有后代的子元素，如下；

// 給 id 為 selected-ul 的 ul 元素下得所有級別的
// 不包含 class=horizontal 的 列表元素 li添加樣式 sub-level
$('#selected-ul li:not(.horizontal)').addClass('sub-level');

     + 這里又涉及到一個 否定式偽類選擇符 :not(selector)，用于選擇所有 去除不匹配 給定的選擇器 的 元素；如：not(div a) 或 not(div, a)。其他相似的還有：

     + has(selector)，選擇含有 selector 所匹配的至少一個元素的 元素，如：

// 匹配一個 div，如果其后代中任何級別（不僅僅是直接子元素）的子元素為 p
$('div:has(p)')

     + addClass 用于為每個匹配的元素添加指定的 class 名，一般和 removeClass() 結合起來使用，如下：

$('p').removeClass('myClass noClass').addClass('yourClass');

     從 jQuery 1.4 開始，addClass 開始支持通過 function 來設置樣式名，如下示例：

// 給定一個有 5 個 li 元素的無需列表 ul 中，在最后一個 li 元素上加上 item-4 樣式
$('ul li:last').addClass(function() {
  return 'item-' + $(this).index();
});

2，XPath 類型的選擇符

     XPath 全稱 XML Path Language，XML 路徑語言。是在 XML 文檔中識別不同元素或元素值的語言。Wiki 上的描述如下( http://zh.wikipedia.org/zh-hans/XPath )：

XPath即為XML路徑語言（XML Path Language），它是一種用來確定XML文檔中某部分位置的語言。

XPath基于XML的樹狀結構，提供在數據結構樹中找尋節點的能力。起初 XPath 的提出的初衷是將其作為一個通用的、介于XPointer與XSL間的語法模型。但是 XPath 很快的被開發者采用來當作小型查詢語言。

     jQuery 庫支持一組基本的 XPath 選擇符。

     + 屬性選擇符(attribute selector)，這個仍然沿用了 XPath 中的慣例，使用 @ 來標識屬性，如下：

// 選擇所有帶 title 屬性的鏈接
$('a[@title]')

     屬性選擇符也可以使用 ^，$，* 分別標識字符串的開始，結尾 以及 字符串中的任意位置。示例如下：

// 給所有屬性 href 值以 mailto: 開頭的鏈接添加 class = mailto
$('a[@href^="mailto:"]').addClass('mailto');

// 給所有屬性 href 值以 .pdf 結尾的鏈接添加 class = pdflink
$('a[@href$=".pdf"]').addClass('pdflink');

// 給所有屬性 href 值中含有 mysite.com 的鏈接添加 class = mysite
$('a[@href*="mysite.com"]').addClass('mysite');

3，自定義選擇符

     自定義選擇符是以冒號(:)開頭，先看如下示例：

// 從匹配的帶有 horizontal 類的 div 集合中，選擇第 2 個項
$('div.horizontal:eq(1)');

// 另一種表示法 CSS 選擇符
$('div:nth-child(2)');

     第一個為自定義選擇符方式，基于 JavaScript 的語法規則，而在 JavaScript 中數組的索引從 0 開始，而 CSS 規范中數組的索引從 1 開始。這兩個我開始以為都是 自定義選擇符呢，看了 API 文檔才知道 :nth-child() 是嚴格來自 CSS 規范的 :(

     與 :eq 類似的 索引相關 的 自定義選擇符還有 :lt()，:gt()，:even()，:odd()。

以上是“jQuery選擇符基礎知識點有哪些”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注創新互聯行業資訊頻道！

本文標題：jQuery選擇符基礎知識點有哪些
URL鏈接：http://m.newbst.com/article14/pjdhge.html

成都網站建設公司_創新互聯，為您提供企業建站、、網站制作、App設計、品牌網站建設、Google

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯

微信小程序開發