Question

如果阴影根中包含一个元素，我怎样才能获得承载所述阴影根的元素？有没有一种方法可以实现这一点，无论元素在树中的位置（即给出对element2或element3的引用，获取对element1的引用）？

element1
└ #shadow-root
  └ element2
    └ element3

Answer 1

对于Shadow DOM v1，您可以使用getRootNode()方法。

然后获取host属性：

event.target.getRootNode().host

Answer 2

您可以继续迭代parentNode，直到获得影子根，然后获得host。

function addOne (a ) {
    console.log('addone', a, a + 1)
    return a + 1
}
function double (a) {
    console.log('double', a, a * 2)
    return a * 2;
}
function square (a) {
    console.log('square', a, a * a)
    return a * a;
}

const lCompose = (...args) => {

    function _lCompose ( initialValue, acc, ...args ) {
        //base case when no args remain, return acc
        if ( !args.length ) {
            console.log('acc', acc)
            return acc;
        } else {
            // recurse, shift ...args and call head(acc)
            const [head, ...tail] = args;
            console.log('head', head)
            const _acc = head(acc);
            _lCompose (initialValue, _acc, ...tail )
        }
    }
    // use _v twice to set as initial value and initial accumulator
    return (initV, initAcc) =>  _lCompose(initV, initAcc, ...args)
}

const trans = lCompose(addOne, double, square);
trans(5, 5) // should return 144

如何使用Shadow DOM v1从阴影根目录中访问主机元素？

2 个答案: