jQ選擇器學習片段(JavaScript 部分對應)

来源:http://www.cnblogs.com/jicheng/archive/2016/10/07/5936048.html
-Advertisement-
Play Games

$()函數在大多的JavaScript類庫中都被作為一個選擇器函數來使用,在jQuery中就是。 $(“#id”)通過id來獲取元素,用來代替document.getElementById()函數。紅色函數(JavaScript) $(“tagName”)通過標簽名來獲取元素,用來代替documen ...


$()函數在大多的JavaScript類庫中都被作為一個選擇器函數來使用,在jQuery中就是。

  $(“#id”)通過id來獲取元素,用來代替document.getElementById()函數。紅色函數(JavaScript)

  $(“tagName”)通過標簽名來獲取元素,用來代替document.getElementsByTagName()函數。

  jQuery的基本語法是:$(selector).action(), selector即選擇器。

jQuery選擇器的分類

  jQuery的選擇器基本可以分為四大類:

  基本選擇器(basic)

  層次選擇器(level)

  過濾選擇器(filter)

  表單選擇器(form)

一、基本選擇器(basic)

  * 匹配所有元素.示例:$(“*")選取所有元素。

  #id根據給定的id匹配元素(最多只返回一個元素).示例: $("#IdName”)選取id="IdName"的元素。

  .class根據給定的類名匹配元素.示例:$(".ClassName”)選取所有class=“ClassName"的元素。

  element根據給定的元素名匹配元素.示例: $(“p")選取所有<p>元素。

  .class.class 示例: $(".ClassName.MyClass”)選取所有且class="MyClass”的元素.(交集)。

  selector1, selector2, …, selectorN, 將每一個選擇器匹配到的元素合併後一起返回.(並集)。

  除了#id選擇器返回單個元素,其他選擇器返回的都是元素集合。

  這是因為HTML規範裡面id應該是唯一的,所以重覆id的元素沒有被考慮。

  如果多個元素的id相同,取這個id也只能獲取第一個元素.即獲取的jQuery對象的length屬性是1。

  如果要匹配的元素不存在,則都返回一個空的jQuery對象。

    基本選擇器之間可以組合,用逗號分隔,結果取所有條件的結果的並集。

  當沒有用逗號分隔時,應該是所有條件都滿足的交集。

二、層次選擇器(level)

  $(“div span”) 選取dia元素里的所有span後代元素,包括直接子元素和更深嵌套的後代元素。(即在div 即可,無論是否多層嵌套

  例:$(“div span”)選取<div>里的所有的<span>元素。

  註意:選擇器都是全頁面掃描,返回一個集合,所有符合選擇條件的元素都會被包括進去。所以多個<div>下麵的<span>都會被選擇。

  $(“parent>child”)選取parent元素下的child子元素,即只有直接子元素被選取.其他後代元素不包括.

  例:$(“div>span”)選取<div>元素下元素名是<span>的子元素.

  $(“prev+next”)選取緊接在prev元素後的next元素(同一層級)。

  例:$(“.one+div”)選取class為one的下一個div元素。

  $(“prev+siblings”)選取prev元素之後的所有siblings元素(同一層級)。

  例:$(“#two~div”)選取id為two的元素後面的所有<div>兄弟元素。

  等價方法:

  $(“prev+next”)等價於方法$(“prev”).next(“next”);選取prev元素之後緊接著的一個next元素。

  $(“prev~sublings”)等價於方法$(“prev”).nextAll(“sublings”),選取prev元素之後的所有同級的sublings元素。

  而$(“prev”).sublings(“next”)方法選取與prev同輩的所有next元素,與前後位置無關。

三、部分過濾選擇器

基本過濾選擇器規則:

基本過濾選擇器

 

選 擇 器 描 述 返 回 示 例
:first 選取第1個元素 單個元素 $("div:first")選取所有 <div>元素
中第一個<div>元素
:last 選取最後1個元素 單個元素 $("div:last")選取所有 <div>元素
中最後一個<div>元素
:not(selector) 去除所有與給定選擇器
匹配的元素
集合元素 $("input:not(.myClass)")選取class不是
myClass的<input>元素
:even 選取索引(從0開始)是偶數
的所有元素
集合元素 $("input:even")選取索引是偶數的
<input>元素
:odd 選取索引(從0開始)是奇數
的所有元素
集合元素 $("input:odd")選取索引是奇數的
<input>元素
:eq(index) 選取索引(從0開始)等於
index的元素
單個元素 $("input:eq(1)")選取索引等於1的
<input>元素
:gt(index) 選取索引(從0開始)大於
index的元素
集合元素 $("input:gt(1)")選取索引大於1的
<input>元素
:lt(index) 選取索引(從0開始)小於
index的元素
集合元素 $("input:lt(1)")選取索引小於1的
<input>元素
:header 選取所有的標題元素,即
<h1>到<h6>
集合元素 $(":header")選取頁面中所有的標題元素
:animated 選取當前正在執行動畫的
所有元素
集合元素 $("div:animated")選取當前正在執行動畫
的<div>元素

 

 

目前先寫到這裡!會陸續更新~~

 


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

-Advertisement-
Play Games
更多相關文章
  • 向一個/一些進程發送一個信號 $kill [ slL] [...] 指定發送的信號,可以使用名稱或者信號編號 列出當前系統的所有信號 ...
  • 概述 多進程代碼區模型(其他區參見copy on write): getpid()、getppid() getuid()、geteuid() getgid(),getegid() fork() include include if(0==pid){ int res=execl("./proc","p ...
  • ps
    查看當前終端所啟動的進程, 不加選項只查看當前終端的進程 ps aux 查看所有進程,ps aux是BSD syntax,ps aux是standard syntax, 但二者的意義完全不同= $man ps ps ef 以全格式的方式顯示所有進程(every)查看當前終端所啟動的進程, 不加選項只 ...
  • 本文首先從巨集觀的角度對進程間的通信方式之一,消息隊列進行闡述,然後以代碼實例對消息隊列進行更近一步的闡述,最後試著暢想消息隊列的潛在應用 ...
  • access() fstat()、stat()、lstat() 獲取文件大小 1. fseek()把offset移到SEEK_END, 再用ftell()返迴文件的大小 2. lseek() , 返迴文件的大小 3.stat(), struct stat st; st.st_size的數值就是文件大 ...
  • 文件描述符(File Descriptor) a small, nonnegative integer for use in subsequent system calls (read(2), write(2), lseek(2), fcntl(2), etc.) ($man 2 open). 每個 ...
  • #include "stm32f10x.h"#include "key.h" //按鍵初始化函數void KEY_Init(void) { GPIO_InitTypeDef GPIO_InitStructure; RCC_APB2PeriphClockCmd(RCC_APB2Periph_GPIOB ...
  • MMU MMU=Segmentation Unit+Paging Unit //MMU: Memory Management Unit logical address = Segmentation Unit= linear address = Paging Unit= physical addres ...
一周排行
    -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.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...