在FireFox中包含众多空格作为文本节点,因此在我们使用nextSibling和previousSibling时就会出现问题。因为FireFox会把文本节点误当做元素节点的兄弟节点来处理。我们可以添加nodeType来判断。当上一节点或者是下一节点为文本节点时,就继续寻找,直到找到下一个元素节点。以下代码仅供参考,在fireFox中测试通过:

        //下一个兄弟节点
function nextSibling(node) {
var tempLast = node.parentNode.lastChild;
if (node == tempLast) return null;
var tempObj = node.nextSibling;
while (tempObj.nodeType != 1 && tempObj.nextSibling != null) {
tempObj = tempObj.nextSibling;
}
return (tempObj.nodeType==1)? tempObj:null;
}
//前一个兄弟节点
function prevSibling(node) {
var tempFirst = node.parentNode.firstChild;
if (node == tempFirst) return null;
var tempObj = node.previousSibling;
while (tempObj.nodeType != 1 && tempObj.previousSibling != null) {
tempObj = tempObj.previousSibling;
}
return (tempObj.nodeType==1)? tempObj:null;
}
测试代码

其中nodeType的值主要有以下几种:

  1. 元素节点的nodeType值为1
  2. 属性节点的nodeType值为2
  3. 文本节点的nodeType值为3

nextSibling和lastSibling的更多相关文章

  1. 【笔记】js parentsNode,lastChild,appendChild,insertBefore,nextSibling的意义及运用

    这几天看书看到这几个属性做几个笔记 parentNode:顾名思义,就是获取某元素的父元素等同于jq的parent(). *注意一下,在调用parentNode 方法的时候 调用的对象必须是用ID 或 ...

  2. JS-firstChild,firstElementChild,lastChild,firstElementChild,nextSibling,nextElementSibling

    <body> <ul id="ul1"> <li>11111</li> <li>22222</li> < ...

  3. 兼容的firstChild,lastChild,nextSibling,previousSibling写法

    在IE下是支持firstChild,lastChild,nextSibling,previousSibling 但是在FF下,由于它会把标签之间的空格当成文本节点,所以为了准确地找到相应的元素,会用 ...

  4. js的nextSibling,属性兼容IE和FF等浏览器

    Firefox中 空白字符,比如回车,空格等也算作一个Node 就是firstChild,nextsbiling这两个.下面给出函数吧.还是代码比较说明问题代码都是网上来的.不过要注意的是,getNe ...

  5. Javascript nextElementSibling和nextSibling

    function next(ele) { if (typeof ele.nextElementSibling == 'object') { return ele.nextElementSibling; ...

  6. JavaScript中childNodes、children、nodeValue、nodeType、parentNode、nextSibling详细讲解

    其中属性.元素(标签).文本都属于节点 <title></title> <scripttype="text/javascript"> windo ...

  7. javascript 中的nextSibling和previousSibling使用注意事项

    JavaScript中的nextSibling和previousSibling和作用类似于jquery的next()和prev(),都是获取下一个/上一个同胞元素,如果下一个同级节点不存在,则此属性返 ...

  8. js nextSibling属性和previousSibling属性概述及使用注意

    1:nextSibling属性 该属性表示当前节点的下一个节点(其后的节点与当前节点同属一个级别):如果其后没有与其同级的节点,则返回null. 需要特别注意的是:该属性在不同的浏览器中的执行结果并不 ...

  9. nextSibling,previousSibling,childNodes常见错误

    在使用nextSibling与previousSibling时,常出现选不到预计对象的情况 eg: <div class="a">1</div> <d ...

随机推荐

  1. P1424

    #include <stdio.h> int main(){ int s = 250; int x, n, distance = 0; scanf("%d %d",&a ...

  2. JZ-035-数组中的逆序对

    数组中的逆序对 题目描述 在数组中的两个数字,如果前面一个数字大于后面的数字,则这两个数字组成一个逆序对.输入一个数组,求出这个数组中的逆序对的总数P.并将P对1000000007取模的结果输出. 即 ...

  3. 修饰符-final

    Java是由C/C++泛生的,其也保留了C/C++的部分特性,如关键字.在C/C++中,关键字有着特殊的含义. final修饰符 在编程中,一般会存在一些变量或方法,程序员不让其数据"发生改 ...

  4. think php 富框架文本编辑器

    商品的详细描述一般都是图文混合.对于图文混合的内容,需要使用富文本编辑器来实现. Ueditor富文本编辑器的下载地址: http://ueditor.baidu.com/website/downlo ...

  5. 15、mysql主从复制的原理

    mysql主从复制 要想实现mysql的主从复制需要先了解二进制日志(bin log)和中继日志(relay log). 二进制日志(bin log) binlog即binary log,二进制日志文 ...

  6. SpringBoot 集成 knife4j (Swagger2)

    SpringBoot 集成 knife4j (Swagger2) 前提 :本文 spring boot版本为 2.6.1 ,knife4j 版本为:3.0.3 1.初始化项目,导入pom依赖 < ...

  7. HamsterBear 构建可启动的镜像(更新中)

    HamsterBear 构建可启动的镜像 Allwinner SoC 上电后会执行BootROM中的程序,会依次从SDIO,SPI等接口查询可引导的设备, SPI设备具有最低引导权,若无法查询到可引导 ...

  8. python算法 前缀和

    这里有 n 个航班,它们分别从 1 到 n 进行编号.有一份航班预订表 bookings ,表中第 i 条预订记录 bookings[i] = [firsti, lasti, seatsi] 意味着在 ...

  9. Java基础—String构造方法

    Java基础--String构造方法 public String(): 创建一个空表字符串对象,不包含任何内容 public String(char[]chs): 根据字符数组的内容,来创建字符串对象 ...

  10. python轻松入门——爬取豆瓣Top250时出现403报错

    关于爬虫程序的418+403报错. 1.按F12打开"开发者调试页面"如下图所示:按步骤,选中Network,找到使用的接口,获取到浏览器访问的信息. 我们需要把自己的python ...