查找第1个标签(元素)的previousSibling属性为何固定为如下代码?

来源:9-11 访问兄弟节点

grass_rt

2019-07-08 15:44

在JS进阶教程中有关prevoiusSibling和nextSibling的章节有一段程序如下:

<script type="text/javascript">
    // 查找页面中的第1个<li>标签
    var firstLi = document.getElementsByTagName("li")[0];
    
    // 编写函数查找上一个sibling标签
    function get_previousSibling(node) {
        var pn = node.previousSibling;
        // 因为循环条件的原因,导致出现了问题
        // 查找的循环条件是“如果上一个sibling类型不是“1” 并且 取值不是null”
        // 如果将循环条件调整为“while (pn && 1!=pn.type )”则正常
        while (1!=pn.type && pn) {
            pn = pn.previousSibling;
        }
        return pn;
    }
    
    var pSibling = get_previousSibling(firstLi);
    if (pSibling) {
        document.write("前一个sibling:" + pSibling.innerHTML);
    } else {
        document.write("已经是第一个元素了");
    }
</script>

由运行结果来看,并没有任何输出内容。倒查JS代码,发现问题出在了get_previous()函数中的while循环条件上:

while (1!=pn.type && pn) {
}

如果调整为如下形式则能够获取输出:

while (pn && 1!=pn.type) {
}

我自己分析,问题可能在于第一个<li>标签之前并没有sibling。pn为第一个<li>标签的前一个sibling,也就是说pn=null。所以循环条件判断时首先判断pn.type会引发问题,而如果首先判断pn!=null则无碍。

请问各位大侠,我的猜测是否有误?请您不吝赐教!

写回答 关注

2回答

  • 狼王梦0_0
    2019-08-19 20:34:05
    已采纳

    没错,如果pn不存在,则其为undefined,就不存在type属性,会报错

  • 狼王梦0_0
    2019-08-19 20:42:02

    刚才打错了,是null,不是undefined?

JavaScript进阶篇

本课程从如何插入JS代码开始,带您进入网页动态交互世界

468195 学习 · 21891 问题

查看课程

相似问题