Javascript节点关系实例分析


Posted in Javascript onMay 15, 2015

本文实例分析了Javascript的节点关系。分享给大家供大家参考。具体如下:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>节点关系</title>
<script type="text/javascript">
function Demo() {
 var divObj = document.getElementById("divDemo");
 //获取父节点
 var parentNode = divObj.parentNode;
 //displayNodeInfo(parentNode);
 //获取子节点
 var childNodes = divObj.childNodes;
 //子节点返回的是一个集合,即数组
 //alert(childNodes.length); //显示节点个数
 //displayNodeInfo(childNodes[0]);
 //获取兄弟节点
 //----------获取上一个兄弟节点
 var preBrotherNode = divObj.previousSibling.previousSibling;
 //标签之间存在空行时,会出现一个空白的文本节点,在获取节点时,一定要注意。
 //displayNodeInfo(preBrotherNode);
 //----------获取下一个兄弟节点
 var nextBrotherNode = divObj.nextSibling;
 displayNodeInfo(nextBrotherNode);
}
function displayNodeInfo(node) {
 alert("Name:" + node.nodeName + ",Type:" + node.nodeType + ",Value:" + node.nodeValue);
}
</script>
</head>
<body>
<input type="button" value="测试" onclick="Demo()" />
<div id="divDemo">div内容</div>
<table>
  <tr>
    <td>单元格1</td>
    <td>单元格2</td>
  </tr>
  <tr>
    <td>单元格3</td>
    <td>单元格4</td>
  </tr>
</table>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
JS BASE64编码 window.atob(), window.btoa()
Mar 09 Javascript
不间断滚动JS打包类,基本可以实现所有的滚动效果,太强了
Dec 08 Javascript
如何确保JavaScript的执行顺序 之jQuery.html深度分析
Mar 03 Javascript
jquery移动listbox的值原理及代码
May 03 Javascript
常见浏览器多长时间会提示“脚本运行时间过长”总结
Apr 29 Javascript
js propertychange和oninput事件
Sep 28 Javascript
jQuery中innerHeight()方法用法实例
Jan 19 Javascript
javascript实现二叉树的代码
Jun 08 Javascript
js学习心得_一个简单的动画库封装tween.js
Jul 14 Javascript
基于vue中css预加载使用sass的配置方式详解
Mar 13 Javascript
微信小程序收货地址API兼容低版本解决方法
May 18 Javascript
js实现随机8位验证码
Jul 24 Javascript
自己编写的支持Ajax验证的JS表单验证插件
May 15 #Javascript
Javascript中prototype属性实现给内置对象添加新的方法
May 14 #Javascript
Javascript进制转换实例分析
May 14 #Javascript
Javascript中For In语句用法实例
May 14 #Javascript
Javascript中With语句用法实例
May 14 #Javascript
javascript用函数实现对象的方法
May 14 #Javascript
javascript中动态函数用法实例分析
May 14 #Javascript
You might like
PHP实现数组递归转义的方法
2014/08/28 PHP
作为程序员必知的16个最佳PHP库
2015/12/09 PHP
Yii框架表单模型和验证用法
2016/05/20 PHP
基于Laravel实现的用户动态模块开发
2017/09/21 PHP
thinkphp整合系列之极验滑动验证码geetest功能
2019/06/18 PHP
jquery提取元素里的纯文本不包含span等里的内容
2013/09/30 Javascript
了解了这些才能开始发挥jQuery的威力
2013/10/10 Javascript
easyui datagrid 键盘上下控制选中行示例
2014/03/31 Javascript
浅谈jquery中delegate()与live()
2015/06/22 Javascript
JS实现同一个网页布局滑动门和TAB选项卡实例
2015/09/23 Javascript
js实现兼容IE、Firefox的图片缩放代码
2015/12/08 Javascript
Bootstrap实现弹性搜索框
2016/07/11 Javascript
angular框架实现全选与单选chekbox的自定义
2017/07/06 Javascript
微信小程序引用公共js里的方法的实例详解
2017/08/17 Javascript
jQuery实现高度灵活的表单验证功能示例【无UI】
2020/04/30 jQuery
React实现类似淘宝tab居中切换效果的示例代码
2020/06/02 Javascript
[02:14]完美“圣”典2016风云人物:xiao8专访
2016/12/01 DOTA
Python完全新手教程
2007/02/08 Python
用Python将IP地址在整型和字符串之间轻松转换
2017/03/22 Python
浅述python2与python3的简单区别
2018/09/19 Python
Python 正则表达式爬虫使用案例解析
2019/09/23 Python
Python tkinter布局与按钮间距设置方式
2020/03/04 Python
基于python计算并显示日间、星期客流高峰
2020/05/07 Python
python环境搭建和pycharm的安装配置及汉化详细教程(零基础小白版)
2020/08/19 Python
GoDaddy英国:全球排名第一的域名注册商
2018/06/08 全球购物
建筑工程技术应届生自荐信
2013/09/27 职场文书
在校生自我鉴定
2014/01/23 职场文书
争先创优活动总结
2014/08/27 职场文书
科级干部群众路线教育实践活动对照检查材料思想汇报
2014/09/20 职场文书
给老师的感谢信
2015/01/20 职场文书
2015年社区流动人口工作总结
2015/05/12 职场文书
千与千寻观后感
2015/06/04 职场文书
ThinkPHP5和ThinkPHP6的区别
2021/03/31 PHP
关于springboot 配置date字段返回时间戳的问题
2021/07/25 Java/Android
实战Python爬虫爬取酷我音乐
2022/04/11 Python
Python使用Opencv打开笔记本电脑摄像头报错解问题及解决
2022/06/21 Python