Shadow DOM内部脚本能否访问该Shadow DOM？

当然可以，不管是开放（open）还是关闭（closed）模式的Shadow DOM，其内部运行的脚本都能正常访问自身所在的Shadow DOM，不受外部访问限制的影响。

具体实现方式 #

在Shadow DOM内部的脚本（包括你示例中引入的menu.mjs模块脚本）里，可以通过以下方式获取Shadow根节点：

// menu.mjs
// 获取当前脚本所在的Shadow根节点
const shadowRoot = document.currentScript.getRootNode();

// 之后就能自由操作Shadow DOM内的元素了
const menuButton = shadowRoot.getElementById('menu-button');
const detailsPanel = shadowRoot.getElementById('details');

menuButton.addEventListener('click', () => {
  detailsPanel.hidden = !detailsPanel.hidden;
});

补充说明 #

• 关闭模式的Shadow DOM只是限制外部脚本通过宿主元素的shadowRoot属性访问，但内部脚本本身就在Shadow DOM的作用域内，完全可以正常访问自身的Shadow根节点。
• 你提到的开放Shadow DOM虽然外部可访问，但内部脚本的访问逻辑和关闭模式没有区别，只是外部多了一条访问路径而已。
• 即便使用Chrome实验性的声明式Shadow DOM扩展（shadowroot属性），内部脚本的访问规则和通过JavaScript创建的Shadow DOM完全一致。

内容的提问来源于stack exchange，提问作者user990666