在iframe中的shadow-root中访问自定义元素

编程问答 2022-06-03

问题描述

我已经搜索了一段时间，但发现了一些与此问题相关的问题，但没有一个对我有用。

我正在尝试使用devTools内的香草javaScript在iframe的shadow-root中访问div内的自定义元素。

iframe > shadow-root > div > app-header

我想访问<app-header>自定义元素。

<iframe name="xpc" id=""xpc sandbox="allow-scripts allow-forms
allow-same-origin allow-popups allow-presentaion allow-modals"
allow="microphone" allowfullscreen class="DT7" src="www.example.com">
    #document
       <!DOCTYPE html>
       <html>
         <head></head>
         <body>
           <speech id="speech">
              #shadow-root (open)
                <!---->
                <link href="www.some-google-font-link.com"
                 rel="stylesheet">
               <div>
                 <app-header fixed style="header": 0ms;
                  transfrom: translate3d(0px,0px,0px);>
                    <p>Hello World</p>
                 </app-header>
               </div>
           </speech>
        </body>
     </html>  
 </iframe>

我尝试使用

  • window.frames.shadowRoot和我得到的ƒ ShadowRoot() { [native code] }
  • window.frames[frame-id].shadowRoot和我得到的Uncaught TypeError: Cannot read property 'shadowRoot' of undefined
  • 如果我尝试制作window.frames.document.querySelector/getElementsById/...，这些总是返回null

那么有什么我可以访问影子根目录内的应用程序标题吗？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

domhtmliframejavascriptshadow-dom