利用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
=
anextElementSibling;//获取下一个节点
alert(nextnodeinnerHTML);
var
a
=
parseInt(nextnodeinnerHTML)
a
+=
1;
nextnodeinnerHTML
=
a;
}
function
jian(a)
{
var
previousnode
=
apreviousElementSibling;
var
a
=
parseInt(previousnodeinnerHTML)
a
-=
1;
a
=
a
>
0
a
:
0;
previousnodeinnerHTML
=
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;----三元表达式。
原理就是先在当前页面中找到你的Iframe对象
var
oframe
=
documentgetElementById("iframe");
再将iframe对象看着是另一个页面的文本对象
var
childDome
=
oframedocumentgetElementById("H");
简洁点的就是：documentgetElementById("iframe")documentgetElementById("H");
或者是：documentgetElementById("Result")contentWindowdocumentgetElementById("h");
先给你看下面两段代码：
<div id="div1">test!</div><script>
consolelog(documentgetElementById("div1")); //这个能够获得值
</script><script>
consolelog(documentgetElementById("div1")); //这个不能获得值！
</script>
<div id="div1">test!</div>
看出原因没有？当js代码是先于html运行时，是获取不到DOM元素的！因为这时候该DOM元素尚未加载到内存，相当于不存在！
要想实现js代码放到任何位置都能获得DOM元素，就要保证代码在页面完全加载完毕后才开始运行，比如：
<script>windowonload=function(){ //网页完全加载完毕才会触发这个事件
consolelog(documentgetElementById("div1")); //这时候就能获得了
}
</script>
<div id="div1">test!</div>
<div id='div1'><a></a></div>
var div1=documentgetElementById('div1');
var a1=div1getElementByTagName('a');
首先 nextSibling 并不是所有浏览器执行后 结果都是一样的！
这是我写的：
<html>
<head>
<meta >
以上就是关于javascript获取dom的下一个节点方法全部的内容，包括:javascript获取dom的下一个节点方法、js怎么获取iframe页面中的dom元素、javascript 如何获得html DOM节点的属性值等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）