25 lines
618 B
HTML
25 lines
618 B
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<body>
|
|
<style> div { width: 100px; height: 100px; } </style>
|
|
<div id="container" style="background: red;">
|
|
<div id="host" style="background: blue;"><div id="child">Some content (DOM)</div></div>
|
|
</div>
|
|
<script>
|
|
|
|
const slotted = document.querySelector('#slotted');
|
|
|
|
const shadowRoot = host.attachShadow({mode: 'closed'});
|
|
shadowRoot.innerHTML = '<div style="width: 100px; height: 100px; background: green;"><slot></slot></div>';
|
|
shadowRoot.querySelector('slot').remove();
|
|
|
|
document.body.getBoundingClientRect();
|
|
|
|
child.remove();
|
|
|
|
document.body.getBoundingClientRect();
|
|
|
|
</script>
|
|
</body>
|
|
</html>
|