document节点对象的获取方式示例介绍
更新时间：2013年12月24日 15:25:57 作者：
如果要操作一个元素，首先要获取到它，下面为大家介绍下document节点对象的获取方式，感兴趣的朋友不要错过
复制代码 代码如下:
<html>
<head>
<title></title>
<script>
/*
document节点对象的获取方式：
*/
//第一种，通过id获取
function documentDemo(){
var tableNode = document.getElementById("tab_id");
tableNode.style.border = "5px solid #00ff00";
}
//第二种，通过name属性
function documentDemo2(){
var inputNode = document.getElementsByName("txt");
alert(inputNode.length);
alert(inputNode[0].value);
}
//第三种，通过标签名
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对象演示" onclick="documentDemo3()"><br/>
<div class="onediv">
这是div中的内容
</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>这是一个span区域</span> <br/>
<a href="#">这是一个超链接</a>
<body>
</html>
相关文章
这篇文章主要介绍了js处理表格对table进行修饰的一些小技巧,需要的朋友可以参考下2014-05-05
通过点击来隐藏页面左栏或右栏，此效果在实际应用中很常见，接下来为大家详细介绍下实现代码，感兴趣的朋友可以参考下哈，希望可以帮助到你2013-04-04
下面小编就为大家带来一篇基于原生js运动方式关键点的总结(推荐)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-10-10
这篇文章主要为大家详细介绍了js随机验证码的实现代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-06-06
这篇文章主要为大家详细介绍了Bootstrap select多选下拉框实现，具有一定的参考价值，感兴趣的小伙伴们可以参考一下代码2016-12-12
javascript实现的字符串与十六进制表示字符串相互转换方法
这篇文章主要介绍了javascript实现的字符串与十六进制表示字符串相互转换方法,涉及javascript字符串转换的相关技巧,在防止SQL注入和XSS中具有一定参考借鉴价值,需要的朋友可以参考下2015-07-07
近来看到个不错的按钮点击效果,当点击时产生一次水波涟漪效果,挺好玩的,下面这篇文章主要给大家介绍了关于使用JavaScript实现按钮涟漪效果的相关资料,需要的朋友可以参考下2022-11-11
在VS Code中，要对 TypeScript代码进行调试，需要先编译 TypeScript 代码为JavaScript代码，这篇文章主要介绍了vscode对typescript代码调试的方法,需要的朋友可以参考下2023-03-03
这篇文章主要介绍了JS实现队列的先进先出功能,结合实例形式分析了基于JS的队列初始化、赋值等相关操作技巧,需要的朋友可以参考下2017-05-05
在JavaScript中存在这样两种原始类型:Null与Undefined。这两种类型常常会使JavaScript的开发人员产生疑惑，在什么时候是Null，什么时候又是Undefined?2015-08-08
最新评论