zoukankan      html  css  js  c++  java
  • 【踩坑】nextSibling 和nextElementSibling的区别

    DOM

    使用nextSibling属性返回指定节点之后的下一个兄弟节点,(即:相同节点树层中的下一个节点)。

    nextSibling属性与nextElementSibling属性的差别: 
    nextSibling属性返回元素节点之后的兄弟节点(包括文本节点、注释节点即回车、换行、空格、文本等等); 
    nextElementSibling属性只返回元素节点之后的兄弟元素节点(不包括文本节点、注释节点);

    注意: 空格、回车也会看作文本,以文本节点对待。 
    下例中,如果两个li元素之间有空格、回车,将返回 “undefined”。

    今天犯了个很蛋疼的错误,调试了半天,才发现在input 与font 标签之间多了个回车。(中间不应有任何内容,包括,回车,换行)

    <input type="text" name="username" onblur="checkName();" /><font></font>

    解决方法1:去掉中间多余的内容,input的nextSibling就是font结点 
    解决办法2:用input 的nextElementSibling 方法,得到的就是font结点

  • 相关阅读:
    又回来咯
    4 20210412-1 原型设计作业
    3 20210405-1 案例分析作业
    202103226-1 编程作业
    阅读任务
    准备工作
    原型设计作业
    案例分析
    编程作业
    构建之法读后感
  • 原文地址:https://www.cnblogs.com/webcabana/p/7273534.html
Copyright © 2011-2022 走看看