在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. WPS:添加公式后,行间距变宽的解决方法

    找到公式所属段落的样式,右键修改样式 左下角'格式'中选择'段落' 段落间距设置为0,不要勾选与文档网格对齐

  2. 2020.10.20 利用POST请求模拟登录知乎

    前两天学习了Python的requests模块的相关内容,对于用GET和PSOT请求访问网页以抓取需要的内容有了初步的了解,想要再从一些复杂的网站积累些经验.最开始我采用最简单的get(url)方法想 ...

  3. dependencies与devDependencies中应该放哪些依赖

    网上一般的解释都是,开发环境用devDependencies,生产环境用dependencies,说的很简明,但是这里有个问题是,哪些包需要放到devDependencies中,哪些包需要放到depe ...

  4. 微服务入门三:SpringCloud Alibaba

    一.什么是SpringCloud Alibaba 1.简介 1)简介 阿里云未分布式应用开发提供了一站式解决方案.它包含了开发分布式应用程序所需的所有组件,使您可以轻松地使用springcloud开发 ...

  5. 我完成了10000小时开发3D引擎

    为什么要开始10000小时? 我以前看过一本叫<异类>的书,书的大概意思是:只要学习10000小时,任何人都可以成为一个领域的大师.这里的"学习"是指完全专注地精进学习 ...

  6. 矩池云上安装yolov4 darknet教程

    这里我是用PyTorch 1.8.1来安装的 拉取仓库 官方仓库 git clone https://github.com/AlexeyAB/darknet 镜像仓库 git clone https: ...

  7. e值计算来了

    e值该如何计算呢? 若关于ex幂级数展开 ex=1+x+x2/2!+x3/3!+•••+xn/n! 取x=1,有e=1+1/2+1/6+••• 接下来就是十分简单的编程 这里选用了python语言(当 ...

  8. ArcMap操作随记(9)

    1.类似PS中功能的工具 [镜像要素].[比例].[延伸] 2.快速获得栅格统计参数 [获取栅格属性]工具 3.[编辑器][创建要素][构造工具] 可以右键,输入半径等参数 4.计算面的角度 [计算面 ...

  9. 报错————Type interface com.ssm.mapper.NewProductMapper is not known to the MapperRegistry.

    报错: Exception in thread "main" org.apache.ibatis.binding.BindingException: Type interface ...

  10. JavaWeb 08_JSP+Dao+Bean+Servlet 实现登录注册(连接数据库,验证码登录,两周内免登陆等功能)

    一.数据库db_01   表usert   字段username,password 二. 目录 三. 配置信息 四. 代码 index.jsp <script type="text/j ...