document節(jié)點(diǎn)對(duì)象的獲取方式示例介紹
更新時(shí)間：2013年12月24日 15:25:57 作者：
如果要操作一個(gè)元素，首先要獲取到它，下面為大家介紹下document節(jié)點(diǎn)對(duì)象的獲取方式，感興趣的朋友不要錯(cuò)過(guò)
復(fù)制代碼 代碼如下:
<html>
<head>
<title></title>
<script>
/*
document節(jié)點(diǎn)對(duì)象的獲取方式：
*/
//第一種，通過(guò)id獲取
function documentDemo(){
var tableNode = document.getElementById("tab_id");
tableNode.style.border = "5px solid #00ff00";
}
//第二種，通過(guò)name屬性
function documentDemo2(){
var inputNode = document.getElementsByName("txt");
alert(inputNode.length);
alert(inputNode[0].value);
}
//第三種，通過(guò)標(biāo)簽名
function documentDemo3(){
var tdNode = document.getElementsByTagName("td");
alert(tdNode.length);
for(var x = 0 ; x < tdNode.length;x++){
alert(tdNode[x].innerText);
}
}
</script>
<style type="text/css">
.onediv{
width:200px;
height:100px;
border:1px solid #f00;
margin-top:20px;
}
table ,td{
border:1px solid #00f;
width:200px;
margin-top:20px;
text-align:center;
}
</style>
</head>
<body>
<input type="button" value="document對(duì)象演示" onclick="documentDemo3()"><br/>
<div class="onediv">
這是div中的內(nèi)容
</div>
<input type="txt" name="txt" >
<input type="txt" name="txt" >
<table cellspacing="0" id="tab_id">
<tr>
<td>java</td>
<td>php</td>
</tr>
<tr>
<td>.net</td>
<td>ios</td>
</tr>
</table>
<span>這是一個(gè)span區(qū)域</span> <br/>
<a href="#">這是一個(gè)超鏈接</a>
<body>
</html>
相關(guān)文章
給easyui datebox擴(kuò)展一個(gè)清空的實(shí)例
下面小編就為大家?guī)?lái)一篇給easyui datebox擴(kuò)展一個(gè)清空按鈕的實(shí)例。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-11-11
非常不錯(cuò)的功能強(qiáng)大代碼簡(jiǎn)單的管理菜單美化版
由于網(wǎng)盤不穩(wěn)定,很多時(shí)候文件提示找不到，幸好U盤里存了. 喜歡這3個(gè)風(fēng)格的朋友們別在PM我啦.....我把文件傳到我服務(wù)器上了..2008-07-07
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)分頁(yè)功能，頁(yè)面查詢實(shí)現(xiàn)分頁(yè)功能，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-05-05
鼠標(biāo)滑過(guò)出現(xiàn)預(yù)覽的大圖提示效果
這篇文章主要介紹了如何實(shí)現(xiàn)鼠標(biāo)滑過(guò)出現(xiàn)預(yù)覽的大圖提示效果,需要的朋友可以參考下2014-02-02
本文主要介紹了TypeScript基本數(shù)據(jù)類型的相關(guān)知識(shí)。具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧2017-03-03
九種js彈出對(duì)話框的方法總結(jié)，需要的朋友可以參考一下2013-03-03
這篇文章主要為大家詳細(xì)介紹了原生js實(shí)現(xiàn)拼圖效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-08-08
微信小程序?qū)崿F(xiàn)點(diǎn)擊返回頂層的方法
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)點(diǎn)擊返回頂層的方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-07-07
KnockoutJS數(shù)組比較算法實(shí)例詳解
這篇文章主要介紹了KnockoutJS數(shù)組比較算法實(shí)例詳解,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-11-11
json對(duì)象轉(zhuǎn)為字符串,當(dāng)做參數(shù)傳遞時(shí)加密解密的實(shí)現(xiàn)方法
下面小編就為大家?guī)?lái)一篇json對(duì)象轉(zhuǎn)為字符串,當(dāng)做參數(shù)傳遞時(shí)加密解密的實(shí)現(xiàn)方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-06-06