在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ querySelector和$()區(qū)別

querySelector和$()區(qū)別

頁面有如下元素

<div class="list-box">
    <div class="buttonrideo">
        <input id="aBtn" type="checkbox" class="default-1"/>
    </div>
</div>

<div class="list-box">
    <div class="buttonrideo">
        <input id="bBtn" type="checkbox" class="default-1"/>
    </div>
</div>

jquery腳本里:

var a = document.querySelector("#aBtn");
var b = $("#aBtn");

a和b有何區(qū)別?發(fā)現(xiàn)b[0]==a,為何?

回答
編輯回答
做不到
  1. a是(調(diào)用querySelector)返回的DOM原生element對象
  2. b是(調(diào)用jQ的$/jQuery,或者可以叫做jQuery構(gòu)造器)返回的jQ包裝對象,jQ包裝對象同時(shí)包含有原生DOM對象和一些jQ自己的東西
  3. b[0]==a是因?yàn)閖Q包裝對象在存儲時(shí)會把原生DOM對象存儲在key[0]的位置(這個(gè)你console一下就很清楚了)
2017年7月6日 10:33
編輯回答
安淺陌

三等也ok, $('#dom')[0]確實(shí)變成了完全的dom對象

2018年4月13日 20:46
編輯回答
練命

a是js對象, b是jquery對象

2017年3月16日 04:56
編輯回答
骨殘心

document.querySelector 是瀏覽器級別的 API,根據(jù)參數(shù)選擇第一個(gè)滿足的 DOM 節(jié)點(diǎn)。

jquery 腳本里面的 $ 必須在引入了 jquery 之后才能使用,也是 dom 的選擇器,選擇滿足條件的 DOM 節(jié)點(diǎn)數(shù)組,現(xiàn)在 jquery 貌似結(jié)果是原生的 DOM 元素了,所以 $('#aBtn')[0] 就等同于 document.querySelector('#aBtn')

2017年4月29日 12:41
編輯回答
囍槑

建議樓主看下DOM對象和jQuery對象及如何轉(zhuǎn)換

2017年9月19日 18:43
編輯回答
心夠野

首先 $() 函數(shù)是JQuery類庫里的,querySelector() 是html5里自帶的。

$() 的行為是查找所有匹配的元素,并封裝成jQuery對象以方便使用。
querySelector() 的行為是查找匹配的第一個(gè)元素,返回的值為原生DOM對象。

而對jQuery對象使用方括號操作符會返回原生的DOM對象,所以 b[0] 返回的是匹配該選擇器的第一個(gè)原生DOM對象,所以會和 querySelector() 返回的值 a 相等。

然后html5里還有一個(gè) querySelectorAll() 方法,該方法返回的值為一個(gè)可迭代的 NodeList 對象。這個(gè)方法的行為可能和jQuery的 $() 更相似。

let a = document.querySelectorAll('#aBtn');
let b = $('#aBtn');

a[0] === b[0];  //未測試,原則上來說應(yīng)該是相等的
2018年2月27日 18:24
編輯回答
枕邊人
  • document.querySelector() 瀏覽器提供,查詢出來為DOM對象
  • $()為jQuery提供的API,查詢出來為jQuery對象,jQuery對象[0]等于對應(yīng)的DOM對象
2018年5月29日 21:12