JQuery獲取對(duì)象的方式介紹
一、引用
官網(wǎng)下載對(duì)應(yīng)的jquery版本文件,在需要用到j(luò)query的地方,用script標(biāo)簽引入進(jìn)來(lái)
<head> <script src="jquery-1.10.2.min.js"></script> </head>
二、獲取對(duì)象
獲取元素包裝集對(duì)象
<body>
<div id="div1">
hello
</div>
<script type="text/javascript">
//獲取元素包裝集對(duì)象
var div1 = $("#div1");
console.log(div1);
console.log(div1[0].innerText);
</script>
</body>DOM對(duì)象獲取
通過(guò)document.getElementById("id屬性值")獲取
如果元素不存在,則獲取的是null
<body>
<div id="div1">塊級(jí)元素</div>
<script type="text/javascript">
//獲取dom對(duì)象
var divDom = document.getElementById("div1");
var divDom2 = document.getElementById("div2");
console.log(document.getElementById("div1"));
console.log(divDom2);//null
</script>
</body>Jquery包裝集對(duì)象
$("#id屬性值");獲取
如果元素不存在,不會(huì)返回null,是一個(gè)空的結(jié)果集
<body>
<div id="div1">塊級(jí)元素</div>
<script type="text/javascript">
//jquery包裝集對(duì)象
var divJquery = $("#div1");
var divJquery2 = $("#div2");
console.log(divJquery);
console.log(divJquery2);
console.log(divJquery.length);
console.log(divJquery2.length);
</script>
</body>Dom轉(zhuǎn)換成jquery包裝集對(duì)象
$("dom對(duì)象");將需要轉(zhuǎn)換的內(nèi)容(dom對(duì)象/標(biāo)簽體)放入$("內(nèi)容")中
<body>
<div id="div1">塊級(jí)元素</div>
<script type="text/javascript">
var divDom = document.getElementById("div1");
//Dom轉(zhuǎn)換成jquery包裝集對(duì)象
console.log($(divDom));
var span = "<span>行內(nèi)元素</span>";
console.log($(span));
</script>
</body>Jquery包裝集對(duì)象轉(zhuǎn)換成Dom
jquery對(duì)象[下標(biāo)] 可以直接獲取到其中的dom對(duì)象
<body>
<div id="div1">塊級(jí)元素</div>
<script type="text/javascript">
//jquery包裝集對(duì)象 轉(zhuǎn)換成Dom
var newDom = divJquery[0];
console.log(newDom);
$('#div1').each(function() {//遍歷
console.log($(this));
console.log(this);
});
</script>
</body>到此這篇關(guān)于JQuery獲取對(duì)象的文章就介紹到這了。希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- jQuery實(shí)現(xiàn)獲取動(dòng)態(tài)添加的標(biāo)簽對(duì)象示例
- jQuery使用$獲取對(duì)象后檢查該對(duì)象是否存在的實(shí)現(xiàn)方法
- jQuery獲取單擊節(jié)點(diǎn)對(duì)象的方法
- jQuery獲取當(dāng)前點(diǎn)擊的對(duì)象元素(實(shí)現(xiàn)代碼)
- jQuery獲取對(duì)象簡(jiǎn)單實(shí)現(xiàn)方法小結(jié)
- jquery獲取當(dāng)前點(diǎn)擊對(duì)象的value方法
- Jquery獲取元素的父容器對(duì)象示例代碼
- jQuery獲取當(dāng)前對(duì)象標(biāo)簽名稱的方法
- Jquery 獲取對(duì)象的幾種方式介紹
- jQuery學(xué)習(xí)筆記 獲取jQuery對(duì)象
相關(guān)文章
Jquery.TreeView結(jié)合ASP.Net和數(shù)據(jù)庫(kù)生成菜單導(dǎo)航條
在網(wǎng)上瀏覽了許多關(guān)于利用Jquery.TreeView插件生成樹(shù)的例子!但是大多數(shù)都沒(méi)有結(jié)合數(shù)據(jù)庫(kù)來(lái)生成樹(shù),很難運(yùn)用到實(shí)際項(xiàng)目中!2010-08-08
jQuery實(shí)現(xiàn)frame之間互通的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)frame之間互通的方法,結(jié)合實(shí)例形式分析了jQuery實(shí)現(xiàn)frame父子框架之間的調(diào)用操作實(shí)現(xiàn)方法,需要的朋友可以參考下2017-06-06
jquery中實(shí)現(xiàn)時(shí)間戳與日期相互轉(zhuǎn)換
本文主要利用jquery擴(kuò)展寫(xiě)了一個(gè)myTime對(duì)象,并寫(xiě)了2個(gè)函數(shù)分別處理日期和時(shí)間戳之間的相互轉(zhuǎn)換。2016-04-04
jquery實(shí)現(xiàn)的Accordion折疊面板效果代碼
這篇文章主要介紹了jquery實(shí)現(xiàn)的Accordion折疊面板效果代碼,通過(guò)jquery鼠標(biāo)click事件操作頁(yè)面元素樣式動(dòng)態(tài)變換實(shí)現(xiàn)手風(fēng)琴折疊效果,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-09-09
使用jQuery Rotare實(shí)現(xiàn)微信大轉(zhuǎn)盤(pán)抽獎(jiǎng)功能
本文主要介紹使用jQuery Rotare實(shí)現(xiàn)微信大轉(zhuǎn)盤(pán)抽獎(jiǎng)功能,并附實(shí)例講解,非常實(shí)用,有需要的朋友可以參考一下。2016-06-06
Bootstrap 時(shí)間日歷插件bootstrap-datetimepicker配置與應(yīng)用小結(jié)
這篇文章主要介紹了Bootstrap 時(shí)間日歷插件bootstrap-datetimepicker配置與應(yīng)用小結(jié),本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-05-05

