JQuery 遍歷的方法

来源:https://www.cnblogs.com/lll6/archive/2022/06/09/16361030.html
-Advertisement-
Play Games

jQuery parent() 方法 parent() 方法返回被選元素的直接父元素。 該方法只會向上一級對 DOM 樹進行遍歷。 下麵的例子返回每個 <span> 元素的直接父元素: 實例 $(document).ready(function(){ $("span").parent(); }); ...


jQuery parent() 方法

parent() 方法返回被選元素的直接父元素

該方法只會向上一級對 DOM 樹進行遍歷。

下麵的例子返回每個 <span> 元素的直接父元素:

實例

$(document).ready(function(){ $("span").parent(); });

 

jQuery parents() 方法

parents() 方法返回被選元素的所有祖先元素,它一路向上直到文檔的根元素 (<html>)。

下麵的例子返回所有 <span> 元素的所有祖先:

實例

$(document).ready(function(){ $("span").parents(); });

您也可以使用可選參數來過濾對祖先元素的搜索。

下麵的例子返回所有 <span> 元素的所有祖先,並且它是 <ul> 元素:

實例

$(document).ready(function(){ $("span").parents("ul"); });

 

jQuery parentsUntil() 方法

parentsUntil() 方法返回介於兩個給定元素之間的所有祖先元素。

下麵的例子返回介於 <span> 與 <div> 元素之間的所有祖先元素:

向下遍歷 DOM 樹

下麵是兩個用於向下遍歷 DOM 樹的 jQuery 方法:

  • children()
  • find()

jQuery children() 方法

children() 方法返回被選元素的所有直接子元素

該方法只會向下一級對 DOM 樹進行遍歷。

下麵的例子返回每個 <div> 元素的所有直接子元素:

實例

$(document).ready(function(){ $("div").children(); });

您也可以使用可選參數來過濾對子元素的搜索。

下麵的例子返回類名為 "1" 的所有 <p> 元素,並且它們是 <div> 的直接子元素:

實例

$(document).ready(function(){ $("div").children("p.1"); });

 

jQuery find() 方法

find() 方法返回被選元素的所有後代元素,一路向下直到最後一個後代。

下麵的例子返回屬於 <div> 後代的所有 <span> 元素:

實例

$(document).ready(function(){ $("div").find("span"); });

下麵的例子返回 <div> 的所有後代:

實例

$(document).ready(function(){ $("div").find("*"); });

jQuery 遍歷- 過濾

縮小搜索元素的範圍

三個最基本的過濾方法是:first(), last() 和 eq(),它們允許您基於其在一組元素中的位置來選擇一個特定的元素。

其他過濾方法,比如 filter() 和 not() 允許您選取匹配或不匹配某項指定標準的元素。

jQuery first() 方法

first() 方法返回被選元素的首個元素。

下麵的例子選取首個 <div> 元素內部的第一個 <p> 元素:

實例

$(document).ready(function(){ $("div p").first(); });


jQuery last() 方法

last() 方法返回被選元素的最後一個元素

下麵的例子選擇最後一個 <div> 元素中的最後一個 <p> 元素:

實例

$(document).ready(function(){ $("div p").last(); });


jQuery eq() 方法

eq() 方法返回被選元素中帶有指定索引號的元素

索引號從 0 開始,因此首個元素的索引號是 0 而不是 1。下麵的例子選取第二個 <p> 元素(索引號 1):

實例

$(document).ready(function(){ $("p").eq(1); });

 

 

add() 把元素添加到匹配元素的集合中
addBack() 把之前的元素集添加到當前集合中
andSelf() 在版本 1.8 中被廢棄。addBack() 的別名
children() 返回被選元素的所有直接子元素
closest() 返回被選元素的第一個祖先元素
contents() 返回被選元素的所有直接子元素(包含文本和註釋節點)
each() 為每個匹配元素執行函數
end() 結束當前鏈中最近的一次篩選操作,並把匹配元素集合返回到前一次的狀態
eq() 返回帶有被選元素的指定索引號的元素
filter() 把匹配元素集合縮減為匹配選擇器或匹配函數返回值的新元素
find() 返回被選元素的後代元素
first() 返回被選元素的第一個元素
has() 返回擁有一個或多個元素在其內的所有元素
is() 根據選擇器/元素/jQuery 對象檢查匹配元素集合,如果存在至少一個匹配元素,則返回 true
last() 返回被選元素的最後一個元素
map() 把當前匹配集合中的每個元素傳遞給函數,產生包含返回值的新 jQuery 對象
next() 返回被選元素的後一個同級元素
nextAll() 返回被選元素之後的所有同級元素
nextUntil() 返回介於兩個給定參數之間的每個元素之後的所有同級元素
not() 從匹配元素集合中移除元素
offsetParent() 返回第一個定位的父元素
parent() 返回被選元素的直接父元素
parents() 返回被選元素的所有祖先元素
parentsUntil() 返回介於兩個給定參數之間的所有祖先元素
prev() 返回被選元素的前一個同級元素
prevAll() 返回被選元素之前的所有同級元素
prevUntil() 返回介於兩個給定參數之間的每個元素之前的所有同級元素
siblings() 返回被選元素的所有同級元素
slice() 把匹配元素集合縮減為指定範圍的子集

您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 亂序問題 在業務編寫 FlinkSQL 時, 非常常見的就是亂序相關問題, 在出現問題時,非常難以排查,且無法穩定復現,這樣無論是業務方,還是平臺方,都處於一種非常尷尬的地步。 亂序問題 在業務編寫 FlinkSQL 時, 非常常見的就是亂序相關問題, 在出現問題時,非常難以排查,且無法穩定復現,這 ...
  • 本文給大家介紹資料庫中用來管理數據更新的重要概念——SQL 事務。簡單來講,事務就是需要在同一個處理單元中執行的一系列更新處理的集合。 本文重點 事務是需要在同一個處理單元中執行的一系列更新處理的集合。通過使用事務,可以對資料庫中的數據更新處理的提交和取消進行管理。 事務處理的終止指令包括 COMM ...
  • 在MySQL 5.7版本,官方稱為enhanced multi-threaded slave(簡稱MTS),複製延遲問題已經得到了極大的改進,可以說在MySQL 5.7版本後,複製延遲問題永不存在。 5.7的MTS本身就是:master基於組提交(group commit)來實現的併發事務分組,再由 ...
  • 導讀: 驗證碼作為網路安全的第一道屏障,其重要程度不言而喻。當前,捲積神經網路的高速發展使得許多驗證碼的安全性大大降低,一些新型驗證碼甚至選擇犧牲可用性從而保證安全性。針對對抗樣本技術的研究,給驗證碼領域帶來了新的契機,並已應用於驗證碼反識別當中,為這場曠日持久攻防對抗註入了新的活力。 分享內容包括 ...
  • 本文將會給大家介紹 DBMS 中用來更新表中數據的方法。SQL 數據的更新處理大體可以分為插入(INSERT)、刪除(DELETE)和更新(UPDATE)三類。本文將會對這三類更新方法進行詳細介紹。 一、數據的插入(INSERT 語句的使用方法) 本節重點 使用 INSERT 語句可以向表中插入數據 ...
  • 互聯網飛速發展的今天,各種App的驗證方法也越來越方便用戶,從一開始的密碼輸入,到後來的指紋解鎖,演變成如今的刷臉認證。刷個臉,就可以解鎖設備、線上/線下支付、通過門禁、快速檢票等。與此同時也伴隨了很多安全問題,首要就是如何判斷用戶的真實性。 HMS Core機器學習服務(ML Kit)的人臉比對和 ...
  • 618電商節火熱進行中,某電商App準備向用戶推送一條全局活動消息,運營準備了兩個推送文案: 文案A:年中囤貨我們更懂你,沒有大優惠怎敢驚動你:美妝個戶,戶外運動,醫療健康,一站式備齊,點擊>> 文案B:全場特價1折起,跨店滿減滿300-30,會員更有折上折,6.1激情預售開啟,現在就搶,一價到底, ...
  • 前言 Angular 14一項令人興奮的特性就是Angular的獨立組件終於來了。 在Angular 14中, 開發者可以嘗試使用獨立組件開發各種組件,但是值得註意的是Angular獨立組件的API仍然沒有穩定下,將來可能存在一些破壞性更新,所以不推薦在生產環境中使用。 如何創建一個獨立組件 對於已 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...