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 相关文章推荐
网页运行时提示对象不支持abigimage属性或方法
Aug 10 Javascript
jQuery实现友好的轮播图片特效
Jan 12 Javascript
小议JavaScript中Generator和Iterator的使用
Jul 29 Javascript
jQuery插件cxSelect多级联动下拉菜单实例解析
Jun 24 Javascript
JavaScript自动点击链接 防止绕过浏览器访问的方法
Jan 19 Javascript
在微信小程序中渲染HTML内容的方法示例
Sep 28 Javascript
vue插件mescroll.js实现移动端上拉加载和下拉刷新
Mar 07 Javascript
微信小程序一周时间表功能实现
Oct 17 Javascript
VUEX 数据持久化,刷新后重新获取的例子
Nov 12 Javascript
node.js使用 http-proxy 创建代理服务器操作示例
Feb 10 Javascript
原生JavaScript实现幻灯片效果
Feb 19 Javascript
vue选项卡切换的实现案例
Apr 11 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文件锁函数flock()详细介绍
2014/11/18 PHP
浅析php单例模式
2014/11/25 PHP
PHP函数用法详解【初始化、嵌套、内置函数等】
2020/06/02 PHP
从父页面读取和操作iframe中内容方法
2009/07/25 Javascript
javascript闭包传参和事件的循环绑定示例探讨
2014/04/17 Javascript
javascript编写实用的省市选择器
2015/02/12 Javascript
自定义百度分享的分享按钮
2015/03/18 Javascript
JavaScript实现模仿桌面窗口的方法
2015/07/18 Javascript
js简单判断移动端系统的方法
2016/02/25 Javascript
深入浅析JavaScript中的3DES
2016/08/24 Javascript
Vue.js双向绑定操作技巧(初级入门)
2016/12/27 Javascript
详解js产生对象的3种基本方式(工厂模式,构造函数模式,原型模式)
2017/01/09 Javascript
ES6新特性之解构、参数、模块和记号用法示例
2017/04/01 Javascript
vue2.0 keep-alive最佳实践
2017/07/06 Javascript
VueJs组件prop验证简单介绍
2017/09/12 Javascript
vue使用原生js实现滚动页面跟踪导航高亮的示例代码
2018/10/25 Javascript
elementUI 设置input的只读或禁用的方法
2018/10/30 Javascript
浅谈layui框架自带分页和表格重载的接口解析问题
2019/09/11 Javascript
解决Vue动态加载本地图片问题
2019/10/09 Javascript
[59:00]OG vs TNC 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
python文件操作相关知识点总结整理
2016/02/22 Python
浅谈Python爬取网页的编码处理
2016/11/04 Python
小白入门篇使用Python搭建点击率预估模型
2018/10/12 Python
Python Django框架防御CSRF攻击的方法分析
2019/10/18 Python
pandas factorize实现将字符串特征转化为数字特征
2019/12/19 Python
Django跨域请求原理及实现代码
2020/11/14 Python
python中threading和queue库实现多线程编程
2021/02/06 Python
html5菜单折纸效果
2014/04/22 HTML / CSS
HTML5轻松实现全屏视频背景的示例
2018/04/23 HTML / CSS
节能环保标语
2014/06/12 职场文书
2015年法制宣传月活动总结
2015/03/26 职场文书
党员干部学习三严三实心得体会
2016/01/05 职场文书
小学生反邪教心得体会
2016/01/15 职场文书
CSS3鼠标悬浮过渡缩放效果
2021/04/17 HTML / CSS
手把手教你使用TensorFlow2实现RNN
2021/07/15 Python
铁头也玩根德 YachtBoy YB-230......
2022/04/05 无线电