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 操作符实例代码
Oct 24 Javascript
node.js中的buffer.Buffer.isEncoding方法使用说明
Dec 14 Javascript
Ztree新增角色和编辑角色回显问题的解决
Oct 25 Javascript
原生js实现键盘控制div移动且解决停顿问题
Dec 05 Javascript
BootStrap轮播HTML代码(推荐)
Dec 10 Javascript
使用微信内嵌H5网页解决JS倒计时失效问题
Jan 13 Javascript
Vue 仿百度搜索功能实现代码
Feb 16 Javascript
详解vue2路由vue-router配置(懒加载)
Apr 08 Javascript
jQuery插件select2利用ajax高效查询大数据列表(可搜索、可分页)
May 19 jQuery
JavaScript对象_动力节点Java学院整理
Jun 23 Javascript
用js屏蔽被http劫持的浮动广告实现方法
Aug 10 Javascript
原生JS实现Ajax跨域请求flask响应内容
Oct 24 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
经典的PHPer为什么被认为是草根?
2007/04/02 PHP
ThinkPHP写数组插入与获取最新插入数据ID实例
2014/11/03 PHP
php使用GD实现颜色渐变实例
2015/06/02 PHP
php获取错误信息的方法
2015/07/17 PHP
Ubuntu彻底删除PHP7.0的方法
2018/07/27 PHP
Dom 结点创建 基础知识
2011/10/01 Javascript
jquery多行滚动/向左或向上滚动/响应鼠标实现思路及代码
2013/01/23 Javascript
解决Jquery load()加载GB2312页面时出现乱码的两种方案
2013/09/10 Javascript
jquery设置text的值示例(设置文本框 DIV 表单值)
2014/01/06 Javascript
深入理解JavaScript系列(37):设计模式之享元模式详解
2015/03/04 Javascript
jquery Validation表单验证使用详解
2020/09/12 Javascript
js实现选中页面文字将其分享到新浪微博
2015/11/05 Javascript
使用jQuery.Qrcode插件在客户端动态生成二维码并添加自定义Logo
2016/09/01 Javascript
AngularJS通过ng-route实现基本的路由功能实例详解
2016/12/13 Javascript
AngularJS路由切换实现方法分析
2017/03/17 Javascript
node.js平台下的mysql数据库配置及连接
2017/03/31 Javascript
微信小程序page的生命周期和音频播放及监听实例详解
2017/04/07 Javascript
记录一次开发微信网页分享的步骤
2019/05/07 Javascript
简单了解vue中的v-if和v-show的区别
2019/10/08 Javascript
详解nginx配置vue h5 history去除#号
2020/11/09 Javascript
[42:25]2018DOTA2亚洲邀请赛 4.5 淘汰赛 LGD vs Liquid 第三场
2018/04/06 DOTA
Python3使用requests登录人人影视网站的方法
2016/05/11 Python
python自动化实现登录获取图片验证码功能
2019/11/20 Python
用什么库写 Python 命令行程序(示例代码详解)
2020/02/20 Python
Python3.7.0 Shell添加清屏快捷键的实现示例
2020/03/23 Python
tensorflow pb to tflite 精度下降详解
2020/05/25 Python
html5 postMessage解决跨域、跨窗口消息传递方案
2016/12/20 HTML / CSS
英国和爱尔兰的自炊式豪华度假小屋:Rural Retreats
2018/06/08 全球购物
波兰在线杂货店:Polski Koszyk
2019/11/02 全球购物
政府信息公开实施方案
2014/05/09 职场文书
领导班子四风问题对照检查材料
2014/09/27 职场文书
委托证明范本
2014/11/25 职场文书
公务员政审个人总结
2015/02/12 职场文书
关于观后感的作文
2015/06/18 职场文书
大学生暑期社会实践的个人总结!
2019/07/17 职场文书
个人工作总结(管理人员)范文
2019/08/13 职场文书