Xander
Xander

Reputation: 397

Can't use Shadow DOM in Chrome 37?

Not sure why I can't seem to use the shadow DOM. I'm in Chrome 37 and I've tried using a couple shadow DOM tutorials or demo's and none of them work?

<div>Hello, World!</div>
<script>
  var host = document.querySelector('div');
  var root = host.webkitCreateShadowRoot();
  root.textContent = 'Hello, Underworld!';
</script>

Do you see anything wrong with this? I've tried it just viewing it in the browser and on a local server.

Was also told to checkout this fiddle to see shadow DOM in action: http://jsfiddle.net/wsCsp/14/ but that doesn't work for me either? There's nothing in about://flags that I see that would disable shadow DOM. caniuse says I can use it in Chrome 37.

Any ideas?

Upvotes: 1

Views: 318

Answers (1)

Fabr&#237;cio Matt&#233;
Fabr&#237;cio Matt&#233;

Reputation: 70159

createShadowRoot is no longer vendor-prefixed in Chrome. Demo

In case you still want to support the vendor-prefixed variant (Android 4.x, old Chrome):

var root = (host.createShadowRoot || host.webkitCreateShadowRoot).call(host);

Demo

Upvotes: 3

Related Questions