javascript - jQ源码中parent.nodeType !== 11的疑问

Question

function parent(elem) {
  var parent = elem.parentNode;
  return parent && parent.nodeType !== 11 ? parent : null;
}

有点不懂为什么要加 parent.nodeType !== 11这个条件，求大神解析一下

Answer 1

nodeType==11 节点是 DocumentFragment

DocumentFragment 节点 不属于文档树

如果一个元素的父节点是 DocumentFragment, 那么说明这个元素还没有插入到文档树中，是没有父节点的。

DocumentFragment 接口表示文档的一部分（或一段）。更确切地说，它表示一个或多个邻接的 Document 节点和它们的所有子孙节点。

DocumentFragment 节点不属于文档树，继承的 parentNode 属性总是 null。

不过它有一种特殊的行为，该行为使得它非常有用，即当请求把一个 DocumentFragment 节点插入文档树时，插入的不是 DocumentFragment 自身，而是它的所有子孙节点。这使得 DocumentFragment 成了有用的占位符，暂时存放那些一次插入文档的节点。它还有利于实现文档的剪切、复制和粘贴操作，尤其是与 Range 接口一起使用时更是如此。

可以用 Document.createDocumentFragment() 方法创建新的空 DocumentFragment 节点。

var $ele = $('<p>https://segmentfault.com/q/1010000007669063</p>');

console.log($ele.parent().length); // 0

Answer 2

nodeType 11 代表的是DocumentFragment，文档片段节点。可以查MDN

Answer 3

DocumentFragment 接口表示的是没有父节点的最小的文档对象.。它被当做一个轻量版本的 Document 使用，用于存储已排好版的或尚未打理好格式的XML片段。
https://developer.mozilla.org...

理解了DocumentFragment这个就好了。

这本身就是一个轻量级文档对象，并不直接在dom树中，缺失部分一部分dom的方法。

jQuery的源代码注释包含这句，或许也可以有参考
// (excepting DocumentFragment context, where the methods don't exist)