Question

您能帮助我理解为什么会发生这种情况吗？

请按照以下步骤重现该行为：

1）转到任何youtube的视频页面，例如this one

2）等待页面完全加载，然后进入控制台并将整个html复制为字符串（document.documentElement.outerHTML）

3）然后在youtube和任何其他网站（例如this）上执行下一个代码。（COPIED_MARKDOWN是第2步）

var fragment = document.createDocumentFragment();
var tmp = fragment.appendChild(document.createElement("div") );
tmp.innerHTML = COPIED_MARKDOWN;
var target = tmp.querySelector('#page-manager')
console.log(target)

结果：

1）在youtube上执行上述代码时，您会看到一棵HTML节点树，但是<ytd-page-manager id="page-manager" class="style-scope ytd-app">将没有任何子节点。（截图№1）

2）在另一个网站上执行上述代码时，您会看到一棵HTML节点树，<ytd-page-manager id="page-manager" class="style-scope ytd-app">将有孩子（屏幕快照№2）

您还可以下载我的小型chrome扩展程序，并将其加载到两个网站上，以跳过上述步骤

扩展名：https://ufile.io/uy3pg

屏幕№1：http://joxi.ru/YmEzvLOH0dwV82

屏幕№2：http://joxi.ru/D2Pzv1qHpQqykr

我仅在chrome上进行过测试：版本71.0.3578.98（正式版本）（64位）

DocumentFragment.innerHTML在不同网站上的奇怪行为

0 个答案: