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 相关文章推荐
js检查页面上有无重复id的实现代码
Jul 17 Javascript
JS连连看源码完美注释版(推荐)
Dec 09 Javascript
在JavaScript中处理时间之setMinutes()方法的使用
Jun 11 Javascript
JS简单获取及显示当前时间的方法
Aug 03 Javascript
微信小程序显示下拉列表功能【附源码下载】
Dec 12 Javascript
深入理解vue中slot与slot-scope的具体使用
Jan 26 Javascript
微信小程序实现图片翻转效果的实例代码
Sep 20 Javascript
Js代码中的span拼接问题解决
Nov 22 Javascript
微信小程序开发搜索功能实现(前端+后端+数据库)
Mar 04 Javascript
Vue打包部署到Nginx时,css样式不生效的解决方式
Aug 03 Javascript
JS实现数组去重的11种方法总结
Apr 04 Javascript
JavaScript中10个Reduce常用场景技巧
Jun 21 Javascript
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检测mysql表是否存在的方法小结
2017/07/20 PHP
Javascript里使用Dom操作Xml
2007/01/22 Javascript
file模式访问网页时iframe高度自适应解决方案
2013/01/16 Javascript
jquery表格内容筛选实现思路及代码
2013/04/16 Javascript
jquery mobile实现拨打电话功能的几种方法
2013/08/05 Javascript
jquery网页元素拖拽插件效果及实现
2013/08/05 Javascript
javascript中的window.location.search方法简介
2013/09/02 Javascript
avalonjs制作响应式瀑布流特效
2015/05/06 Javascript
noty ? jQuery通知插件全面解析
2016/05/18 Javascript
浅析JavaScript中作用域和作用域链
2016/12/06 Javascript
Vue2.0 从零开始_环境搭建操作步骤
2017/06/14 Javascript
jQuery实现的页面遮罩层功能示例【测试可用】
2017/10/14 jQuery
vue项目实现记住密码到cookie功能示例(附源码)
2018/01/31 Javascript
微信小程序仿今日头条导航栏滚动解析
2019/08/20 Javascript
vue 动态表单开发方法案例详解
2019/12/02 Javascript
Python随机数用法实例详解【基于random模块】
2017/04/18 Python
python实现图片处理和特征提取详解
2017/11/13 Python
微信跳一跳辅助python代码实现
2018/01/05 Python
Python骚操作之动态定义函数
2019/03/26 Python
详解Python传入参数的几种方法
2019/05/16 Python
基于python3 的百度图片下载器的实现代码
2019/11/05 Python
使用python创建Excel工作簿及工作表过程图解
2020/05/27 Python
PyChon中关于Jekins的详细安装(推荐)
2020/12/28 Python
联想法国官方网站:Lenovo法国
2018/10/18 全球购物
乌克兰的第一家手表店:Deka
2020/03/05 全球购物
php优化查询foreach代码实例讲解
2021/03/24 PHP
如何客观的进行自我评价
2013/12/17 职场文书
幼儿园安全检查制度
2014/01/30 职场文书
农业局学习党的群众路线教育实践活动心得体会
2014/03/07 职场文书
大学班级学风建设方案
2014/05/01 职场文书
售后服务承诺书怎么写
2014/05/21 职场文书
关于拾金不昧的感谢信
2015/01/21 职场文书
万里长城导游词
2015/01/30 职场文书
初中生活随笔
2015/08/15 职场文书
Python time库的时间时钟处理
2021/05/02 Python
vue elementUI表格控制对应列
2022/04/13 Vue.js