Question

I am curious to see how this situation can be solved. In browser, I am seeing the following content (note the button is in highlight) However, the selected the shadow root document.querySelector("ow-356ai793a").shadowRoot lost the entire content within the div element <div shell-wrapper="" data-spot-im-direction="ltr"></div>, as shown here

• 我如何选择丁顿的“代码”和带;丁顿的作用=“丁顿”数据-编号=“show-more”数据-spot-im-class=“load-more-messages” aria-label=“Show more comments”数据- openweb-allow-amp=“true”类型=“Button__button-11-4-6 Button_first-11-4-64-6 Button__isEllipsis-11-4-6 Button__hoverBackground-11-4-6spicv_load-more-messages”><span category=“Button__contentWrapper-11-4-6”><span>Show More comment</span></span></button> in the soil?

Answer 1

只有在具备、mode的情况下,才能从Java的影子中获取任何东西。

如果在<代码>shadowDOM上建立,element.attachShadow({模式:“封闭式”});,你不能与 Java接洽shadowDOM。

因此,如果您的影子是,开放。您可以使用以下文字。

const shadowRoot = document.querySelector("ow-356ai793a").shadowRoot;
const button = shadowRoot.querySelector("button[data-spmark= show-more ]");

Answer 2

你可以尝试:

const shadowRoot = document.querySelector("ow-356ai793a").shadowRoot;
const observer = new MutationObserver((mutations) => {
  for (const mutation of mutations) {
    if (mutation.addedNodes.length > 0) {
      for (const node of mutation.addedNodes) {
        if (node.matches("button[role= button ]")) {
          console.log(node);
          observer.disconnect();
        }
      }
    }
  }
});

observer.observe(shadowRoot, { childList: true });

然而,这种方法在任何情况下都不能奏效,因为它取决于如何和何时创建纽扣元素并附在影子后。如果不适当使用,也可能造成业绩问题或记忆泄露。因此,我建议使用一个图书馆或框架,为等待出现诸如Cypress、Selenium、Pppeteer等内容提供方法或选择。

友情链接