<div id="hello-text" name="Петя"></div>
const helloTextElement = document.getElementById('hello-text');
helloTextElement.attachShadow({mode: 'open'});
helloTextElement.shadowRoot.innerHTML = `
<style>
p {font: bold 20px sans-serif}
</style>
<p>
Привет! Меня зовут ${helloTextElement.getAttribute('name')}.
</p>`;
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.