如何在Chrome中逐点获取影子根中的节点？-解网

问：

我可以在Firefox中获取影子根中的节点，但是只能在Chrome中使用，但是，它只能返回主dom元素。document.caretPositionFromPointdocument.caretRangeFromPoint

下面是一个在Firefox中工作的演示：

<!DOCTYPE html>
<html lang="en">
  <head>
    <title></title>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
  </head>
  <body>
    <article>
      <p>This is a paragraph of main frame.</p>
      <div id="shadow-host"></div>
    </article>

    <script>
      const shadowRootHost = document.querySelector("#shadow-host");
      const shadowRoot = shadowRootHost.attachShadow({ mode: "open" });
      shadowRoot.innerHTML = `<p>This a paragraph from shadow root.</p>`;

      setTimeout(() => {
        const position = document.caretPositionFromPoint(60, 60);
        const theNode = position.offsetNode;
        console.log("the Node", theNode);
      }, 500);
    </script>
  </body>
</html>

我想知道如何在 Chrome 中获取影子根节点？

javascript google-chrome dom shadow-root

如何在Chrome中逐点获取影子根中的节点？

How to get the node in shadow root by point in Chrome?

评论