coryhouse / html5-web-components

Repo for HTML5 Web Component Fundamentals on Pluralsight
2 stars 0 forks source link

createShadowRoot is deprecated in favor of attachShadow #1

Open coryhouse opened 5 years ago

coryhouse commented 5 years ago

https://developer.mozilla.org/en-US/docs/Web/API/Element/createShadowRoot

wmanning commented 4 years ago

Example:

<!DOCTYPE html>
<html>

  <head>
  </head>

  <body>
    <h1>Hello World from the Light DOM</h1>

    <div id="shadow-host"></div>

    <script>
      var host = document.getElementById('shadow-host');
      var root = host.attachShadow({mode: 'open'});

      root.innerHTML = "<h1>Hello World from Shadow DOM!</h1>";
    </script>
  </body>

</html>