javascript 获取dom书的下一个节点。
利用javascript 写一个在页面点击加减按钮实现数字的累加。。
简略的html大概如此。看得懂就好不要在意这些细节啊
<input type="button" value="+" onclick="jia(this)" />
<label class="num">0</label>
<input type="button" value="-" onclick="jian(this)" />
样子是这样的
javascript 代码如下
<script type="text/javascript">
function jia(a)
{
var nextnode = a.nextElementSibling;//获取下一个节点 alert(nextnode.innerHTML);
var a = parseInt(nextnode.innerHTML)
a += 1;
nextnode.innerHTML = a; }
function jian(a) {
var previousnode = a.previousElementSibling;
var a = parseInt(previousnode.innerHTML)
a -= 1;
a = a > 0 ? a : 0;
previousnode.innerHTML = a;
}
</script>
解释一下:
function jian(a)和
function jia(a)就是当前点击的对象了。在onclick事件接的方法里加了this;
- nextElementSibling 获取当前节点的下一个节点(获得下一个兄弟节点)
- previousElementSibling 获取当前节点的上一个节点
注意: IE将跳过在节点之间产生的空格文档节点(如:换行字符),而Mozilla不会这样——FF会把诸如空格换行之类的排版元素视作节点读取,因此,在ie 中用nextSibling便可读取到的下一个节点元素,在FF中就需要这样写:nextElementSibling了。
上面的解释的意思的使用 nextElementSibling 和previousElementSibling 获得下一个兄弟节点和上一个兄弟节点,可以去掉换行,空格上面之类的,直接找到我们标签元素。但是下面的两个
nextSibling
previousSibling 也是得下一个兄弟节点和上一个兄弟节点的,只是在IE中好用
--------------------关键字解释
parseInt 转化功能。
a = a > 0 ? a : 0;----三元表达式。
javascript 获取dom书的下一个节点。的更多相关文章
- javascript 获取下一个节点
下一个节点: nextElementSibling 上一个节点 previousElementSibling <div> <select onchange="alert(t ...
- 剑指Offer(书):二叉树的下一个节点
题目:给定一个二叉树和其中的一个结点,请找出中序遍历顺序的下一个结点并且返回.注意,树中的结点不仅包含左右子结点,同时包含指向父结点的指针. 分析:若一个节点有右子树,那么他的下一个节点就是他右子树中 ...
- javaScript获取文档中所有元素节点的个数
HTML+JS 代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...
- 剑指offer-二叉树的下一个节点
题目描述 给定一个二叉树和其中的一个结点,请找出中序遍历顺序的下一个结点并且返回.注意,树中的结点不仅包含左右子结点,同时包含指向父结点的指针. 解题思路 分情况考虑如下: 若该节点为空,则直 ...
- 剑指offer(57)二叉树的下一个节点
题目描述 给定一个二叉树和其中的一个结点,请找出中序遍历顺序的下一个结点并且返回.注意,树中的结点不仅包含左右子结点,同时包含指向父结点的指针. 题目分析 这题一定要画图,因为只有画图我们才能分清楚下 ...
- 【剑指offer】08二叉树的下一个节点,C++实现
原创博文,转载请注明出处! # 题目 父节点指向子节点的指针用实线表示,从子节点指向父节点的指针用虚线表示. # 思路 如果节点有右子节点,则右子节点的最左节点是该节点的下一个节点.例如,寻找b的下一 ...
- 剑指Offer的学习笔记(C#篇)-- 二叉树的下一个节点(好理解版本)
题目描述 给定一个二叉树和其中的一个结点,请找出中序遍历顺序的下一个结点并且返回.注意,树中的结点不仅包含左右子结点,同时包含指向父结点的指针. 一 . 理解题意 该题目我们可以借鉴一个非常影响不好的 ...
- 剑指offer第二版-8.二叉树的下一个节点
描述:给定一棵二叉树和其中的一个节点,找出中序遍历序列的下一个节点.树中应定义指向左节点.右节点.父节点的三个变量. 思路: 1.如果输入的当前节点有右孩子,则它的下一个节点即为该右孩子为根节点的子树 ...
- 剑指offer笔记面试题8----二叉树的下一个节点
题目:给定一棵二叉树和其中的一个节点,如何找出中序遍历序列的下一个节点?树中的节点除了有两个分别指向左.右子节点的指针,还有一个指向父节点的指针. 测试用例: 普通二叉树(完全二叉树,不完全二叉树). ...
随机推荐
- 韩顺平循序渐进学JAVA从入门到精通 视频全套,需要的联系我
0讲-开山篇.avi 10讲-访问修饰符.重载.覆盖.avi 11讲-约瑟夫问题.avi 12讲-多态.avi 13讲-抽象类.接口.avi 14讲-final.作业评讲.avi 15讲-作业.测试题 ...
- Zabbix_proxy的架设
一.安装zabbix-proxy与导入数据库 1. 安装 zabbix-server $ sudo rpm -ivh http://repo.zabbix.com/zabbix/3.0/rhel/7/ ...
- 第五篇 elasticsearch express插入数据
1.后端 在elasticsearch.js文件夹下添加: function addDocument(document) { return elasticClient.index({ index: i ...
- p2071 座位安排
传送门 题目 已知车上有N排座位,有N*2个人参加省赛,每排座位只能坐两人,且每个人都有自己想坐的排数,问最多使多少人坐到自己想坐的位置. 输入格式: 第一行,一个正整数N. 第二行至第N*2+1行, ...
- 阶段4-独挡一面\项目-基于视频压缩的实时监控系统\Sprint1-基于Epoll架构的采集端程序框架设计\第2课-基于Epoll的采集端程序框架设计
回顾之前的整个程序架构 把epoll机制应用到这个架构上去 下面主要去分析我们的系统中有没有需要等待的事件,先看看采集子系统 在采集子系统当中,摄像头有数据,摄像头采集到图像数据可以作为一个等待事件. ...
- Spring JdbcTemplate+JdbcDaoSupport实例(和比较)
首先,数据库是这样的,很简单. 当然,要引入spring的包,这里我全部导入了,省事. applicationContext.xml是这样的: <?xml version="1.0&q ...
- jquery ajax + struts2用例
ajax var url = '/itsm/contract/contract!deleteShopItemById.action'; var shopItemId= selectRows[x].da ...
- Neutron网络研究
你将学到什么 虚拟机的Ping包是如何出外网的 DevStack环境准备 节点 硬件配置 网络配置 类型 操作系统 DevStack 4G 2CPU 50GB 2张网卡(NAT模式) VMWare虚拟 ...
- C#之数据类型转换
前言 在C#中学习中,像在VB学习的时候一样,我们会接触到很多种数据类型,但是VB中在用数据类型的时候,我们会考虑这个数据要求多大的内存,或者说有时候为了满足很少的大内存事件,而狠心分配给它较大 ...
- Oracle 12c登陆sys用户的方法
本机安装过oracle 12c之后,发现用sql plus执行命令conn sys/change_on_install as sysdba; 提示如下图: 后在网上搜索此问题,需要先登陆system账 ...