nextSibling和previousSibling
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>nextSibling</title>
</head>
<body>
<ul id="u1">
<li id="a">javascript</li>
<li id="b">jquery</li>
<li id="c">html</li>
</ul>
<ul id="u2">
<li id="d">css3</li>
<li id="e">php</li>
<li id="f">java</li>
</ul>
<script type="text/javascript">
function get_nextSibling(n){
var x=n.nextSibling;
while (x && x.nodeType!=1){
x=x.nextSibling;
}
return x;
} function get_previousSlibling(n){
var x=n.previousSlibling;
while(x && x.nodeType!=1){
x=x.previousSlibling;
}
return x;
} var x=document.getElementsByTagName("li")[0];
document.write(x.nodeName);
document.write(" = ");
document.write(x.innerHTML); var y=get_nextSibling(x); if(y!=null){
document.write("<br />nextsibling: ");
document.write(y.nodeName);
document.write(" = ");
document.write(y.innerHTML);
}else{
document.write("<br>已经是最后一个节点");
} </script>
</body>
</html>
1. nextSibling 属性可返回某个节点之后紧跟的节点（处于同一树层级中）。
语法：nodeObject.nextSibling
2.previousSibling 属性可返回某个节点之前紧跟的节点（处于同一树层级中）。
语法：nodeObject.previousSibling
注意: 两个属性获取的是节点。Internet Explorer 会忽略节点间生成的空白文本节点（例如，换行符号），而其它浏览器不会忽略。
解决问题方法:
判断节点nodeType是否为1, 如是为元素节点，跳过。
nextSibling和previousSibling的更多相关文章
- javascript 中的nextSibling和previousSibling使用注意事项
JavaScript中的nextSibling和previousSibling和作用类似于jquery的next()和prev(),都是获取下一个/上一个同胞元素,如果下一个同级节点不存在,则此属性返 ...
- nextSibling，previousSibling，childNodes常见错误
在使用nextSibling与previousSibling时,常出现选不到预计对象的情况 eg: <div class="a">1</div> <d ...
- js nextSibling属性和previousSibling属性概述及使用注意
1:nextSibling属性 该属性表示当前节点的下一个节点(其后的节点与当前节点同属一个级别):如果其后没有与其同级的节点,则返回null. 需要特别注意的是:该属性在不同的浏览器中的执行结果并不 ...
- nextSibling和lastSibling
在FireFox中包含众多空格作为文本节点,因此在我们使用nextSibling和previousSibling时就会出现问题.因为FireFox会把文本节点误当做元素节点的兄弟节点来处理.我们可以添 ...
- 读书笔记：JavaScript DOM 编程艺术（第二版）
读完还是能学到很多的基础知识,这里记录下,方便回顾与及时查阅. 内容也有自己的一些补充. JavaScript DOM 编程艺术(第二版) 1.JavaScript简史 JavaScript由Nets ...
- （第六天）DOM
概念 文档对象模型(DOM)是表示和操作HTML和XML文档内容的基础API. 选取文档元素 (1)通过ID选取元素 var id = document.getElementById("se ...
- DOM document object model learn
DOM对W3C DOM而言,HTML文档中任何一样东西都是一个节点,而且节点之间是有层次的.如<p>I am a JavaScript hacker.</p>有两个节点,一个是 ...
- JavaScript的理解记录（5）
---接上篇: 三.DOM解析: 1.Document Object Model(DOM):是表示和操作HTML和XML文档内容的基础API;其中几个重要的类有:Document和Element,Te ...
- BOM和DOM
Day 01 正课: 1.什么是DOM: 2.DOM Tree 3.遍历DOM树: 1.什么是DOM: 原生js=ECMAScript(核心语法)+ DOM(专门操作网页内容的API)+ 3天 BOM ...
随机推荐
- LeetCode答案（python）
1. 两数之和 给定一个整数数组 nums 和一个目标值 target,请你在该数组中找出和为目标值的那 两个 整数,并返回他们的数组下标. 你可以假设每种输入只会对应一个答案.但是,你不能重复利用这 ...
- C++ 实验六
Part.2 // 合并两个文件内容到一个新文件中. // 文件名均从键盘输入 #include <iostream> #include <fstream> #include ...
- Python中你不知道的特性
内置函数print(*objects, sep=' ', end='\n', file=sys.stdout, flush=False) 本函数是实现对象以字符串表示的方式格式化输出到流文件对象fil ...
- 【java基础 7】java内存区域分析及常见异常
本篇博客,主要是读书笔记总结,还有就是结合培训分享的总结,没有太多的技术含量! java 的自动内存管理机制,使得程序员不用为每一个new惭怍的对象写配对的delete/ free代码(回想起C++的 ...
- 公钥密码之RSA密码算法扩展欧几里德求逆元！！
扩展欧几里得求逆元 实话说这个算法如果手推的话问题不大,无非就是辗转相除法的逆过程,还有一种就是利用扩展欧几里德算法,学信安数学基础的时候问题不大,但现在几乎都忘了,刷题的时候也是用kuangbin博 ...
- BZOJ 2005 [Noi2010]能量采集 ——Dirichlet积
[题目分析] 卷积一卷. 然后分块去一段一段的求. O(n)即可. [代码] #include <cstdio> #include <cstring> #include < ...
- BZOJ 2179 FFT快速傅立叶 ——FFT
[题目分析] 快速傅里叶变换用于高精度乘法. 其实本质就是循环卷积的计算,也就是多项式的乘法. 两次蝴蝶变换. 二进制取反化递归为迭代. 单位根的巧妙取值,是的复杂度成为了nlogn 范德蒙矩阵计算逆 ...
- [luoguP2221] [HAOI2012]高速公路（线段树）
传送门 考虑每一段对答案的贡献 用每一段的左端点来表示当前这一段,那么区间就变成了[1,n-1] 如果询问区间[l,r],其中一个点的位置为x,则它对答案的贡献为(x-l)*(r-x)*s[x](s[ ...
- POJ 1006 生理周期【数论】
这题是有中文版的(右上角选项卡里把default改成简体中文)然后看到他把biorhythms翻成生理周期我可耻的笑了......23333 如果没有限定从日期d开始,完全可以从第一天起开始计时,因此 ...
- 把项目变成intellij idea和eclipse项目
就通过maven把它build成一个IDE项目,执行以下命令,打开CMD: $ cd 项目名 $ mvn eclipse:eclipse or mvn idea:idea