问题标签 [documentfragment]

您能帮我将 documentFragment 对象转换为 JSON 格式吗？我需要它将消息中的 documentFragment 发送到 iframe。这是我的代码：

但它不起作用（输出空对象 {} ）。

我正在尝试documentFragment使用 javascriptquerySelector方法检索一个元素。

我得到了我对 Chrome 和 Firefox 的期望，但不是 Safari（Mac OS，Safari 12.0.2）。

jsFiddle：https ://jsfiddle.net/bwqvrex2/

我错过了什么，还是只是一个错误？

当将document.elementFromPoint应用于指向 documentFragment 内某处元素的 point(x,y) 时，它返回容器元素。例如：

预期结果： 如果 (x,y) 指向#my_documentfragment，则 document.elementFromPoint(x,y) 它应该返回#my_documentfragment。

实际结果： 返回#container。文档片段的容器

1. 当页面的某些部分是 documentFragments 时，document.elementFromPoint(x,y) 的替代方法是什么？
2. jquery.parents() 在作为 documentFragment 一部分的元素上的替代方法是什么

所以我基本上只是尝试将元素从一个节点移动到另一个节点。我创建了一个片段，然后将我的子元素附加到它上面。

我是否误解了片段是如何工作的？

它奇怪地在片段上工作......甚至在我的电脑上工作但它变得越来越陌生。

我认为在我打印我的变量和我探索它的那一刻之间有一个变化。

我试图在 dom 中插入一些 SVG 图标，但 SVG（父节点）总是被使用（子节点）替换。有人帮我弄清楚吗？

源代码图片在这里

在这里写代码

我可以成功地将它们登录到控制台，但它们似乎没有出现在文档中。

我已经将它附加到父节点（techs_icons），但此时无法弄清楚！

更新代码

这个快照似乎在这里工作

仍然不会显示在 DOM 中。实际上，它们被附加了，因为当我将它们悬停在检查器中时，它们在那里但不可见。

代码的第二次更新

看起来你需要在我的 svg>use>“fake element”中创建某种“fake”元素，比如 shadowRoot，我实际上不明白为什么浏览器在导入 SVG 文件时会创建这样的元素！

我在检查元素时发现了这一点，并看到浏览器实际上自动创建了那个阴影。

SVG

显示自动创建的阴影元素的检查代码

所以在这一点上回顾一下：

1. 将 forEach() 循环的结果添加到文档片段，在该循环结束后，我将该片段作为子元素附加到真正的 DOM 元素 (.techs_info)
2. 创建了一个阴影并将其作为子元素附加到 use 元素

问题仍然存在，当将阴影附加到 use 元素时，DOM 或控制台都没有实际显示任何内容！

考虑这个template带有两个 flatx-element和一个嵌套的 HTML。

如何初始化（触发构造函数）从fooTemplate文档片段克隆的所有自定义元素，而不将其附加到 DOM，也不通过扩展内置元素is="x-element"；要么是整个片段。

请注意，脚本使用defer属性执行。

我正在尝试使用纯 javascript 将 div 动态附加到 DOM 元素。当我在没有 setTimeout 函数的情况下使用它时，它可以正常工作，但是当我使用 setTimeout 函数时，不会附加文档片段（如果我 console.log 它可以看到它存在，但我显然做错了）。

我必须使用 setTimeout，因为我将要循环的数组包含 1-5000 个项目，并且我不想在渲染这些项目时锁定整个 gui。

编辑：

我意识到我忘记了 setTimeout “使其异步”（James 也注意到了，谢谢！）——难怪它不起作用。将其包裹在 Promise 中，结果如下：

我正在尝试使用javascript一遍又一遍地创建一组元素，一旦用户输入一个文本，它会在其中显示带有一个带有图像的按钮的文本，但我找不到一种方法来有效地做到这一点。

我要创建的当前方法将要求每个元素都有一个 id 标记，以便我可以调用 appendChild 将元素连接在一起。

我还需要将一个 create 元素附加到另一个 create 元素中，这会增加问题

这就是我试图在 html 代码中实现的目标（不需要创建 div，因为它已经在 html 代码中）

电流输出显示为

如果有人知道更好的方法来做到这一点，将不胜感激

我按照MDN上的说明使用<template>. 与示例中给出的略有不同，我的代码是：

但是，似乎item, 其中__proto__isDocumentFragment没有getElementsByName方法。现在有getElementByIdand对我来说是不是很困惑querySelector。

有什么理由吗？

如果相关，我的浏览器是 FireFox Quantum 69.0.1，Chrome Canary 79.0.3918.0。

最近我看到了下面的 html DOM：

请查看查询元素的控制台输出display-1并告诉我它的 parentNode 是一个文档片段。这怎么可能发生？我阅读了几篇文章，每个人都说在将文档片段附加到 DOM 元素后，文档片段仍然是空节点，并且它的子节点通常附加到 DOM 中。

我尝试通过使用 shadow dom、自定义元素等来创建这种情况。但是没有什么能导致我出现这种行为。

我在chrome和edge上试过了。

希望任何人都可以给我一个提示。从昨天开始我一直在努力解决这个问题......