第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全，請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題，去搜搜看，總會(huì)有你想問的

如何訪問 shadow-root 深處的元素

如何訪問 shadow-root 深處的元素

胡說叔叔 2023-06-09 17:35:33
我怎樣才能訪問影子根深處的元素？<vaadin-combo-box>        #shadow-root            <vaadin-text-field id="input">                <vaadin-combo-box-dropdown-wrapper id="overlay">                    #shadow-root(open)                        <vaadin-combo-box-dropdown id="dropdown">                            #shadow-root(open)                                <vaadin-combo-box-overlay id="overlay">                                    #shadow-root(open)                                     <div part="overlay" id="overlay">                                        <div part="content" id="conent">                                            #shadow-root(open)                                                <div id="scroller">                                                    <iron-list id="selector">                                                        #shadow-root(open)                                                            <vaadin-combo-box-item>                                                                ......                                                               我想設(shè)置vaadin-combo-box-item元素的樣式，但我不知道如何訪問該元素。
查看完整描述

2 回答

?
弒天下

TA貢獻(xiàn)1818條經(jīng)驗(yàn) 獲得超8個(gè)贊

這個(gè)問題沒有簡單的答案，因?yàn)槟仨氃L問非常深的 DOM 元素。


為了讓它不那么痛苦，你必須創(chuàng)建一個(gè)函數(shù)來訪問提供元素的影子 dom，如下所示：


const getShadowRoot = (elem, selector) => elem.shadowRoot.querySelector(selector);


const vaadinComboBox = getShadowRoot(document, 'vaadin-combo-box');

const vaadinTextField = getShadowRoot(vaadinComboBox, '#input');

const vaadinComboBoxWrapper = getShadowRoot(vaadinTextField, '#overlay');

const vaadinComboBoxDropdown = getShadowRoot(vaadinComboBoxWrapper, '#dropdown');

const vaadinComboBoxOverlay = getShadowRoot(vaadinComboBoxDropdown, '#overlay');

const vaadinComboBoxContent = getShadowRoot(vaadinComboBoxOverlay, '#conent');

const vaadinComboBoxSelector = getShadowRoot(vaadinComboBoxContent, '#selector');

const vaadinComboBoxItem = getShadowRoot(vaadinComboBoxContent, 'vaadin-combo-box-item');

盡管如此，如此多的 shadowDom 元素看起來像是架構(gòu)錯(cuò)誤


查看完整回答
反對(duì) 回復(fù) 2023-06-09
?
互換的青春

TA貢獻(xiàn)1797條經(jīng)驗(yàn) 獲得超6個(gè)贊

我找不到在任意深度獲取元素的答案。這就是我想出的；您可以使用排序函數(shù)遞歸地下降到影子 DOM，以獲取父元素或元素本身：


function* descend(el, sel, parent) {

        if (el.matches(sel)) {

            yield parent ? el.parentElement : el;

        }

        if (el.shadowRoot) {

            for (const child of el.shadowRoot.children) {

                yield* descend(child, sel, parent);

            }

        }

        for (const child of el.children) {

            yield* descend(child, sel, parent);

        }

    };

使用示例：


const vid = [...descend(window.parent.document.querySelector("body"), "video", false)][0]



查看完整回答
反對(duì) 回復(fù) 2023-06-09
  • 2 回答
  • 0 關(guān)注
  • 243 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

 公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)