用js得到網(wǎng)頁(yè)中所有的div的id
核心代碼
<SCRIPT LANGUAGE = "JavaScript"> function handleAllTags(){ var arrayOfDocFonts; if (document.all || document.getElementById) { arrayOfDocFonts = document.getElementsByTagName("div"); } alert("本文檔DIV標(biāo)記個(gè)數(shù)分別為: " + arrayOfDocFonts.length + "個(gè)。"); var tmp = 0; for (var i = 0; i < arrayOfDocFonts.length; i++) { if (arrayOfDocFonts[i].id != "") alert("其ID是:div[" + eval(i + 1) + "].id=" + arrayOfDocFonts[i].id); tmp += 1; } } </SCRIPT> <body> <div id="d1"></div> <div id="d2"></div> <div id="d3"></div> <div id="d4"></div> <a href="#" onclick="handleAllTags()">點(diǎn)擊計(jì)算div個(gè)數(shù)</a> </body>
JAVASCRIPT-如何獲取頁(yè)面元素對(duì)象,元素ID
1. 通過(guò)元素id獲取頁(yè)面元素對(duì)象
var d = document.getElementById("id");
2. 獲取和修改元素的文本內(nèi)容
獲?。篸.innerText 修改: d.innerText="xxx";
3. 獲取和修改文本框的內(nèi)容
獲取: i.value 修改: i.value="xxx";
4. 獲取和修改元素的html內(nèi)容
案例1:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript"> function myfn(){ //得到文本框 和 div的元素對(duì)象 var i = document.getElementById("i1"); var d1 = document.getElementById("d1"); var d2 = document.getElementById("d2"); //獲取和修改元素的文本內(nèi)容 d1.innerText='BBB'; //把文本框的文本內(nèi)容取出給到div d2.innerText = i.value; } </script> </head> <body> <input type="button" value="按鈕" onclick="myfn()"> <input type="text" id="i1" value="AAA"> <div id="d1"></div> <div id="d2"></div> </body> </html>
案例2:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript"> function myfn(){ //獲取文本輸入框和div的元素對(duì)象 var i = document.getElementById("i1"); var d = document.getElementById("d1"); //判斷用戶(hù)輸入的內(nèi)容是否是數(shù) if(isNaN(i.value)){ //如果不是數(shù)顯示xxx d.innerText="輸入錯(cuò)誤,請(qǐng)重新輸入!"; }else{ d.innerText = i.value*i.value; } } </script> </head> <body> 請(qǐng)輸入一個(gè)數(shù):<input type="text" id="i1"> <input type="button" value="平方" onclick="myfn()"> <div id="d1"></div> </body> </html>
到此這篇關(guān)于用js得到網(wǎng)頁(yè)中所有的div的id的文章就介紹到這了,更多相關(guān)div的id內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JS限制Textarea文本域字符個(gè)數(shù)的具體實(shí)現(xiàn)
這篇文章介紹了JS限制Textarea文本域字符個(gè)數(shù)的具體實(shí)現(xiàn),有需要的朋友可以參考一下2013-08-08JS網(wǎng)頁(yè)在線獲取鼠標(biāo)坐標(biāo)值的方法
這篇文章主要介紹了JS網(wǎng)頁(yè)在線獲取鼠標(biāo)坐標(biāo)值的方法,涉及javascript操作頁(yè)面窗口位置元素的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-02-02JavaScript實(shí)現(xiàn)讀取上傳視頻文件的時(shí)長(zhǎng)和第一幀畫(huà)面過(guò)程講解
當(dāng)我們做一個(gè)后臺(tái)系統(tǒng)的音視頻管理模塊時(shí),通常要限制文件的大小和類(lèi)型,這篇文章主要介紹了JavaScript實(shí)現(xiàn)讀取上傳視頻文件的時(shí)長(zhǎng)和第一幀畫(huà)面過(guò)程,需要詳細(xì)了解實(shí)現(xiàn)方法可以參考下文2023-05-05微信小程序scroll-view不能左右滑動(dòng)問(wèn)題的解決方法
scroll-view為滾動(dòng)視圖,分為水平滾動(dòng)和垂直滾動(dòng),這篇文章主要給大家介紹了關(guān)于微信小程序scroll-view不能左右滑動(dòng)問(wèn)題的解決方法,需要的朋友可以參考下2021-07-07JavaScript中創(chuàng)建對(duì)象和繼承示例解讀
這篇文章主要介紹了JavaScript中怎樣創(chuàng)建對(duì)象和繼承,需要的朋友可以參考下2014-02-02JS實(shí)現(xiàn)簡(jiǎn)單的鍵盤(pán)打字的效果
本文給大家分享的是使用javascript實(shí)現(xiàn)的簡(jiǎn)單的鍵盤(pán)打字效果,十分的簡(jiǎn)單實(shí)用,推薦給有需要的小伙伴參考下。2015-04-04prototype與jquery下Ajax實(shí)現(xiàn)的差別
Ajax技術(shù)在web中應(yīng)用的相當(dāng)廣泛,最近項(xiàng)目需要用到Ajax,由于主站所用的是Jquey,而某個(gè)欄目的開(kāi)發(fā)用的是prototype,這樣一來(lái)就必須對(duì)JS代碼做調(diào)整了。2009-09-09微信小程序獲取用戶(hù)手機(jī)號(hào)碼的詳細(xì)步驟
最近改了一個(gè)公司項(xiàng)目,新增加了一個(gè)獲取用戶(hù)手機(jī)號(hào)功能,里面用到了關(guān)于獲取用戶(hù)信息和用戶(hù)手機(jī)號(hào)的功能,下面這篇文章主要給大家介紹了關(guān)于微信小程序獲取用戶(hù)手機(jī)號(hào)碼的相關(guān)資料,需要的朋友可以參考下2022-07-07