Question

我有以下HTML：

<body>Testing1<span id="t1" style="background-color: green;">Testing2</span>Testing3</body>

当我尝试以下操作时：

alert(window.jQuery('#t1').prev().nodeType); // undefined - tried get(0) as well

alert(window.jQuery('#t1').get(0).nodeType); // 1

alert(window.jQuery('#t1').next().nodeType); // undefined

为什么当我尝试获取上一个和下一个文本元素的节点类型时，我得到了未定义的内容？

奇怪的是，如果我在跨度之前放置b标记，则prev().get(0).nodeType返回1是否意味着文本节点和注释无法检测到？

Answer 1

问题是prev和next返回jQuery对象，而不是DOM元素。您必须再次使用get：

alert(window.jQuery('#t1').next().get(0).nodeType);

请注意，您也可以使用数组语法在指定的索引处获取底层DOM元素：

alert(window.jQuery('#t1').next()[0].nodeType);

修改

重新阅读你的问题，看到你已经尝试过了。您认为prev和next不会获得文本或评论节点是正确的。他们只会得到元素。

#t1之前的文本节点不是元素，因此prev不会返回任何内容（#t1之前或之后没有兄弟元素。）

你可以这样做：

alert(window.jQuery('#t1').get(0).previousSibling.nodeType); //3 alert(window.jQuery('#t1').get(0).nextSibling.nodeType); //3

但我不完全确定这些浏览器的兼容性。

Answer 2

你可以使用普通的js：

alert(document.getElementById('t1').previousSibling.nodeType);
alert(document.getElementById('t1').nextSibling.nodeType);

当然你应该检查getElementById是否返回一个元素，并且在尝试获取nodeType之前有一个next / previousSibling。

获取下一个和上一个nodeType

2 个答案: