document节点对象的获取方式示例介绍


Posted in Javascript onDecember 24, 2013
<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>
Javascript 相关文章推荐
一个JavaScript函数把URL参数解析成Json对象
Sep 24 Javascript
JavaScript极简入门教程(二):对象和函数
Oct 25 Javascript
jQuery的ready方法详解
Nov 27 Javascript
jQuery下拉美化搜索表单效果代码分享
Aug 25 Javascript
Node.js中常规的文件操作总结
Oct 13 Javascript
js操作浏览器的参数方法
Jan 21 Javascript
jQuery实现的简单无刷新评论功能示例
Nov 08 jQuery
angularJs中跳转到指定的锚点实例($anchorScroll)
Aug 31 Javascript
通过JQuery,JQueryUI和Jsplumb实现拖拽模块
Jun 18 jQuery
浅析webpack-bundle-analyzer在vue-cli3中的使用
Oct 23 Javascript
vue自定义指令限制输入框输入值的步骤与完整代码
Aug 30 Javascript
Vue Mint UI mt-swipe的使用方式
Jun 05 Vue.js
JQuery结合CSS操作打印样式的方法
Dec 24 #Javascript
jQuery动态改变图片显示大小(修改版)的实现思路及代码
Dec 24 #Javascript
jquery自动切换tabs选项卡的具体实现
Dec 24 #Javascript
从数组中随机取x条不重复数据的JS代码
Dec 24 #Javascript
JS过滤url参数特殊字符的实现方法
Dec 24 #Javascript
JS控制图片等比例缩放的示例代码
Dec 24 #Javascript
JS 屏蔽按键效果与改变按键效果的示例代码
Dec 24 #Javascript
You might like
用PHP和ACCESS写聊天室(五)
2006/10/09 PHP
[原创]效率较高的php下读取文本文件的代码
2008/07/02 PHP
PHP以mysqli方式连接类完整代码实例
2014/07/15 PHP
php简单生成一组与多组随机字符串的方法
2017/05/09 PHP
PHP使用Redis实现防止大并发下二次写入的方法
2017/10/09 PHP
使用composer 安装 laravel框架的方法图文详解
2019/08/02 PHP
Laravel 集成微信用户登录和绑定的实现
2019/12/27 PHP
用JTrackBar实现的模拟苹果风格的滚动条
2007/08/06 Javascript
Extjs学习笔记之二 初识Extjs之Form
2010/01/07 Javascript
js location.replace与location.reload的区别
2010/09/08 Javascript
jquery更换文章内容与改变字体大小代码
2013/09/30 Javascript
IONIC自定义subheader的最佳解决方案
2016/09/22 Javascript
微信小程序 wx.uploadFile无法上传解决办法
2016/12/14 Javascript
JavaScript 事件对内存和性能的影响
2017/01/22 Javascript
jQuery Datatable 多个查询条件自定义提交事件(推荐)
2017/08/24 jQuery
[01:46]TI4西雅图DOTA2前线报道 中国选手抱团调时差
2014/07/08 DOTA
python实现ip查询示例
2014/03/26 Python
python实现删除文件与目录的方法
2014/11/10 Python
Python 序列的方法总结
2016/10/18 Python
基于Python的接口测试框架实例
2016/11/04 Python
pygame游戏之旅 添加键盘按键的方法
2018/11/20 Python
Python openpyxl 遍历所有sheet 查找特定字符串的方法
2018/12/10 Python
python视频按帧截取图片工具
2019/07/23 Python
django 文件上传功能的相关实例代码(简单易懂)
2020/01/22 Python
python+selenium+PhantomJS抓取网页动态加载内容
2020/02/25 Python
Python如何使用turtle库绘制图形
2020/02/26 Python
安装Anaconda3及使用Jupyter的方法
2020/10/27 Python
adidas澳大利亚官方网站:adidas Australia
2018/04/15 全球购物
MADE法国:提供原创设计师家具
2018/09/18 全球购物
简历的个人自我评价范文
2014/01/03 职场文书
给同事的道歉信
2014/01/11 职场文书
农村党员对照检查材料
2014/09/24 职场文书
对公司的意见和建议
2015/06/04 职场文书
Python 读写 Matlab Mat 格式数据的操作
2021/05/19 Python
Python初学者必备的文件读写指南
2021/06/23 Python
sql注入教程之类型以及提交注入
2021/08/02 MySQL