js如何获取shadow-root(close)内的dom？shadow-root是什么？

首先回答shadow-root是什么？

只需要了解一点：通过 Shadow Root，可以将组件的内部结构封装起来，外部无法直接访问或修改。这种封装性提高了组件的安全性和稳定性。

既然已经用了shadowRoot，说明页面主人并不想让你用js获取里面的内容。

shadowRoot有open和close的区别，网上大都是open情况下用js获取：

复制代码

document.querySelector('shadow父节点').shadowRoot.querySelector('xxxx')

但在close情况下，document.querySelector('shadow父节点').shadowRoot为null，这种方式就不可用了。例如：

那么要怎么用js获取内部的标签呢？

光依赖js此时是没什么办法了，但是也有曲线救国的策略。

首先你需要让ai给你写一个浏览器插件，随便什么都可以，似乎油猴脚本也行

接下来要做的，就是在页面dom加载前，将所有的shadow-root(close)修改为shadow（open），代码如下：

复制代码

Element.prototype._attachShadow = Element.prototype.attachShadow;
Element.prototype.attachShadow = function (init) {
  return this._attachShadow(Object.assign({}, init || {}, { mode: 'open' }));
};

我是正好在做浏览器插件，所以直接让ai完成功能后注入上下文，在页面加载之前执行就行

成功之后，你会看到：

嘻嘻，这下就可以用shadow-root(open)的方式去获取内部隐藏的dom了