使用时在jQuery中创建新的html节点
$('<some-node>some html code</some-node>');
在你附上它之前它不会成为DOM的一部分.但是,这并不意味着节点没有父节点.
如果节点是空的,例如:
var myNewNode = $('<div>Hello</div>');
您可以检查父母:
myNewNode[0].parentNode; // Who is the parent?
看到你明白了
DocumentFragment
结果. DocumentFragment是一些类似于document的对象,但不是DOM树的一部分.
奇怪的是现在来了.当你创建一个空节点时,比如
var myNewEmptyNode = $('<div></div>');
并尝试检查其内容
myNewEmptyNode[0].parentNode; // Who is now the parent?
你很惊讶
null
我无法理解这种行为,并在jQuery文档中找不到它.我在尝试调试为什么javascriptMVC mxui模式在空div上失败时发现了它.
我已经在Chromium和Opera中测试了这种行为,所以它似乎不是与浏览器相关的问题.
有人对此有解释吗?
解决方法
这是因为jQuery将document.createElement用于“快速”HTML字符串,而jQuery.buildFragment用于所有其他(更“复杂”)HTML字符串. < DIV>< / DIV>被认为是快速的,而< div> a< / div>不是.
我设置了一个小提琴,你可以检查:http://jsfiddle.net/PzBSY/2/.
“Quick”是defined的正则表达式:
var rsingleTag = /^<(\w+)\s*\/?>(?:<\/\1>)?$/;
它传递空div字符串,但不传递非空div字符串.检查后检查if
/else
block是否为两个分支.
所以它基本上是因为jQuery使用非空div显式构建文档片段,而它不使用空div(它只使用document.createElement(“div”)).