1. 程式人生 > >JS API-新的選擇器 selector

JS API-新的選擇器 selector

新的選擇器
document.querySelector("selector");
selector:根據CSS選擇器返回第一個匹配到的元素,如果沒有匹配到,則返回null;
支援: Chrome 4.0+, FireFox 3.5+, Safari 3.2+, Opera 10.1+, IE 8+


document.querySelectorAll("selector");
selector:根據CSS選擇器返回所有匹配到的元素陣列,如果沒有匹配到,則返回空陣列;
支援: Chrome 4.0+, FireFox 3.5+, Safari 3.2+, Opera 10.1+, IE 8+


document.getElementsByClassName("selector");
selector:根據類選擇器返回所有匹配到的元素陣列,如果沒有匹配到,則返回空陣列;
支援: Chrome 4.0+, FireFox 3.0+, Safari 3.2+, Opera 10.1+, IE 8+

案例如下:
HTML結構如下:

複製程式碼
 1 <div class="content">  
 2 <ul>    
 3 <li>例項</li>
 4     
 5 <li class="exp">例項</li>
 6     
 7 <li class="exp">例項</li>
 8     
 9 <li class="exp">例項</li>
10     
11 <li>例項</li>
12 
13   </ul>
14 
15 </div
>
複製程式碼

 1、如果想要獲得第一個li元素,我們只需要:
document.querySelector(".content ul li");


2、如果想要獲得所有li元素,我們只需要:
document.querySelectorAll(".content ul li");


3、如果想要獲得所有class為w3c的li元素,我們只需要:
document.getElementsByClassName("w3c");

相關推薦

JS API-選擇 selector

新的選擇器 document.querySelector("selector"); selector:根據CSS選擇器返回第一個匹配到的元素,如果沒有匹配到,則返回null; 支援: Chrome 4.0+, FireFox 3.5+, Safari 3.2+, Oper

NIO 選擇 Selector

字節 () 激發 就是 異常檢查 執行 1.4 移植 異常   選擇器提供選擇執行已經就緒的任務的能力,這使得多元 I/O 成為可能。就像在第一章中描述的那樣,就緒選擇和多元執行使得單線程能夠有效率地同時管理多個 I/O 通道(Channels)。C/C++代碼的工具箱中,

Java Nio選擇Selector

Selector(選擇器)是Java NIO中能夠檢測一到多個NIO通道,並能夠知曉通道是否為諸如讀寫事件做好準備的元件。這樣,一個單獨的執行緒可以管理多個channel,從而管理多個網路連線 ,減少伺服器的效能開銷。 建立Selector 通過Selector 提供的

js閉包 選擇 面向物件 事件 操作頁面

閉包js函式的巢狀定義,定義在內部的函式 就稱之為閉包為什麼使用閉包: 1.一個函式要使用另一個函式的區域性變數 2.閉包會持久化包裹自身的函式的區域性變數 3.解決迴圈繫結 function outer() { var num =10; function

js閉包 選擇 面向對象 事件 操作頁面

his 就是 sele 處理 學習 per 點擊事件 駝峰命名 css 閉包js函數的嵌套定義,定義在內部的函數 就稱之為閉包為什麽使用閉包: 1.一個函數要使用另一個函數的局部變量 2.閉包會持久化包裹自身的函數的局部變量 3.解決循環綁定 fun

JS、JQuery選擇 選擇內容前後帶空格

JS、JQuery選擇器 選擇內容前後帶空格 文章目錄 JS、JQuery選擇器 選擇內容前後帶空格 問題產生背景 今天碰到了一個`不合理`的需求(不服來辯。。) 要求儲存的編碼(一個欄位,類似於班級)

JAVA jsoup 爬蟲 傻瓜入門實錄 (2-1) 選擇 Selector 實務分解說明

JAVA jsoup 爬蟲 傻瓜入門實錄 (2-1) 選擇器 Selector 實務分解說明這部分要講解的是個人常用的jsoup選擇器說明上一篇我們講完各種型態解析成Document型態的方法實做當我們解析成Document後 就可以開始做爬蟲的動作爬蟲前我們應該先分析要抓取的網頁資料你要抓的資料是在哪個di

css中選擇(selector)

常用選擇器 最常用的選擇器型別時型別選擇器和後代選擇器。型別選擇器用來尋找特定型別的元素,比如段落或標題元素,只需指定希望特定型別的元素,比如段落或標題元素,只需要指定希望應用樣式的額元素的名稱。來興選擇器有時候也稱為元素選擇器或者簡單選擇器。 p{co

手把手教你寫Js日期時間選擇(2)-樣式實現

上一節為大家分析了一下日期時間選擇器的基本組成結構; 這一節主要講解樣式實現. 準備工作 首先來確定一下各個部分的大小,主要是高度.為了元件顯示比較和諧,這裡整個控制元件高度為200px; 選擇項的高度為40px; 示意圖: 大家可以根據需

使用JS提高效能--選擇

前言:jquery選擇器提供了簡潔方便的查詢dom元素的API,經過jquery封裝過的dom元素是一個代理物件,包含dom本身,長度等等,可以列印jquery選擇器檢視。一個jquery選擇器代理了諸多。所以在dom查詢的速度上是慢於原生js選擇器的。 document

JS自定義選擇

選擇器部分: var jojo = (function () { var jojo = function (arr) { var _this = this, i = 0; // Create array-like object

JS 邏輯判斷選擇 || &&

|| 與 &&在JS裡與其它語言不一樣,這是選擇器運算子,而非邏輯運算子。 對於||來說,若判斷為true,則返回第一個值,為false返回第二個值。 &&相反,若判斷為 true,則返回第二個,為 false為返回第一個值。 絕對不是像其

深入淺出JMS(四)--ActiveMQ訊息選擇Selector

一、序言        訊息大多數情況都是傳送到broker 的,在知道Destination 的情況下,都可以消費,因此有些情況下需要我們將訊息分組、隔離,或則指定A訊息,只能有A消費者消費等等情況,這裡做個大概的介紹和例項。 二、例項場景        我們通過有時候

Java NIO 選擇(Selector)的內部實現(poll epoll)

之前強調這麼多關於linux核心的poll及epoll,無非是想讓大家先有個認識: Java NIO中的選擇器依賴作業系統核心的這些系統呼叫,我們這裡只講解與linux核心相關的NIO實現,當然,windows或其他作業系統實現大體上是類似的,相信大家也可以觸類旁通。 那

CheckBox使用選擇Selector

第一步,layout檔案中設定checkbox屬性: android:button="@null"//這樣設定能解決checkbox在選中下不會顯示系統預設打勾圖示,否則設定選擇器會重疊自定義圖示 第二步,在drawable包下新建selecor檔案,準備兩張圖片,一張選中

android中listview的item點選切換實現效果(選擇selector

public class V2_Adapter_TarentoCreateActivity_OverSea_City extends BaseAdapter{private V2_TarentoCreateActivity_OverSea_Place v2_TarentoCreateActivity_Over

scrapy:選擇selector

當抓取網頁時,常見的任務是從HTML原始碼中提取資料。現有的一些庫可以達到這個目的:BeautifulSouplxmlScrapy 提取資料有自己的一套機制。它們被稱作選擇器(seletors),因為他們通過特定的 XPath 或者 CSS 表示式來“選擇” HTML 檔案中

Java NIO通俗程式設計之選擇Selector(四)

最後一步就是根據不同的事件,編寫相應的處理程式碼:/* * 根據不同的事件做處理 * */ protected void process(SelectionKey key) throws IOException{ // 接收請求 if (key.isAcceptable()) {

NIO中和選擇Selector

NIO中和選擇器Selector 在上一篇的JAVA中NIO再深入我們學會了如何使用Buffer,而在Java中IO和NIO中我們

Java NIO 選擇 Selector

選擇器 Selector 是 I/O 多路複用的核心元件,它可以監控實現了 SelectableChannel 的[通道](https://www.cnblogs.com/robothy/p/14234437.html)的就緒情況。有了多路複用(multiplexing) I/O 模型,使得單執行緒的 Jav