我想在使用 Shadow DOM 的自定义元素内使用带有哈希 URL 的锚元素。我希望浏览器向下滚动到该锚点，但它没有这样做（至少 Chrome 是这样）。
Detail:
我有一个像这样的index.html：
...
<a href="#destinationInsideShadowDOM">Jump</a>
...
<my-custom-element></my-custom-element>
...
另一个自定义元素的 html 文件，其中包含锚点：
<template id="my-custom-element">
...
<a id="destinationInsideShadowDOM"></a>
...
</template>
当我单击 index.html 中的链接时，我希望浏览器向下滚动到该锚点。
当我将锚点移动到自定义元素之外的 index.html 时，它可以工作，但不能在内部。
进入控制台并输入以下内容：
document.getElementById('destinationInsideShadowDOM')
结果将是null因为具有该 ID 的元素不属于该文档。它属于自定义元素的shadowRoot。
正如@treeno 在评论中提到的，你可以使用Element.scrollIntoView() https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView得到你想要的行为。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
