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 相关文章推荐
jquery 常用操作整理 基础入门篇
Oct 14 Javascript
JQuery设置和去除disabled属性的5种方法总结
May 16 Javascript
Javascript 高阶函数使用介绍
Jun 15 Javascript
jQuery序列化表单成对象的简单实现
Nov 29 Javascript
JS正则匹配中文的方法示例
Jan 06 Javascript
设置cookie指定时间失效(实例代码)
May 28 Javascript
详解Vue整合axios的实例代码
Jun 21 Javascript
关于AngularJS中ng-repeat不更新视图的解决方法
Sep 30 Javascript
详解js访问对象的属性和方法
Oct 25 Javascript
vue写h5页面的方法总结
Feb 12 Javascript
用node.js写一个jenkins发版脚本
May 21 Javascript
如何将Node.js中的回调转换为Promise
Nov 10 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
我的论坛源代码(六)
2006/10/09 PHP
一个PHP缓存类代码(附详细说明)
2011/06/09 PHP
Laravel 5框架学习之模型、控制器、视图基础流程
2015/04/08 PHP
PHP随手笔记整理之PHP脚本和JAVA连接mysql数据库
2015/11/25 PHP
利用laravel搭建一个迷你博客实战教程
2017/08/13 PHP
两个DIV等高的JS的实现代码
2007/12/23 Javascript
JS实现屏蔽shift,Ctrl,alt等功能键的方法
2015/06/01 Javascript
jQuery多条件筛选如何实现
2015/11/04 Javascript
javascript创建对象的3种方法
2016/11/02 Javascript
jquery实现提示语淡入效果
2017/05/05 jQuery
jQuery中的deferred对象和extend方法详解
2017/05/08 jQuery
SpringMVC简单整合Angular2的示例
2017/07/31 Javascript
详解.vue文件中监听input输入事件(oninput)
2017/09/19 Javascript
详解vue中点击空白处隐藏div的实现(用指令实现)
2018/04/19 Javascript
jquery.param()实现数组或对象的序列化方法
2018/10/08 jQuery
原生JS实现图片懒加载之页面性能优化
2019/04/26 Javascript
微信小程序网络请求实现过程解析
2019/11/06 Javascript
详解Python中break语句的用法
2015/05/14 Python
python+selenium实现自动抢票功能实例代码
2018/11/23 Python
python 利用pyttsx3文字转语音过程详解
2019/09/25 Python
python pygame实现滚动横版射击游戏城市之战
2019/11/25 Python
Django单元测试中Fixtures的使用方法
2020/02/26 Python
python实现猜拳游戏
2020/03/04 Python
HTML5实现多张图片上传功能
2016/03/11 HTML / CSS
豪华床上用品、床单和浴室必需品:Peacock Alley
2019/09/04 全球购物
英国最大的汽车配件在线商店:Euro Car Parts
2019/09/30 全球购物
普天C++笔试题
2016/03/20 面试题
几道数据库的面试题或笔试题
2014/05/31 面试题
幼儿园小班教师寄语
2014/04/03 职场文书
中学生运动会口号
2014/06/07 职场文书
小区门卫岗位职责范本
2014/08/24 职场文书
教师个人培训总结
2015/02/11 职场文书
关于观后感的作文
2015/06/18 职场文书
装修安全责任协议书
2016/03/22 职场文书
Nginx同一个域名配置多个项目的实现方法
2021/03/31 Servers
Pandas||过滤缺失数据||pd.dropna()函数的用法说明
2021/05/14 Python