I have an markup with embed tag want to access #document contents.

Tried to traverse till embed tag after fetching couldn't able to access inner nodes however there is an function available getElementByTagName() or getElementByClassName() but it not helped

var embedContent = document.getElementById('embed1')
var parentContents = x.parentElement.parentNode.lastElementChild.getElementsByTagName('embed')
> [function, embed1: function]

Below able to access embed tag after this how to fetch values of respective tag

Is there alternate way to achieve this??If yes please provide any url or examples.

I have an markup with embed tag want to access #document contents.

Tried to traverse till embed tag after fetching couldn't able to access inner nodes however there is an function available getElementByTagName() or getElementByClassName() but it not helped

var embedContent = document.getElementById('embed1')
var parentContents = x.parentElement.parentNode.lastElementChild.getElementsByTagName('embed')
> [function, embed1: function]

Below able to access embed tag after this how to fetch values of respective tag

Is there alternate way to achieve this??If yes please provide any url or examples.

• javascript
• jquery
• html
• dom
• embed

1 Answer 1

The content of an <embed> tag is essentially locked Shadow DOM - it's a whole new document that Chrome can access but you can't.

It's easy to check what properties you can access:

var xObj = document.getElementById('xObj');

for (var p in xObj) {
  var value = null;
  try {
    value = xObj[p];
  } catch (err) {}

  if (value)
    console.log(p, value);
}

<embed id="xObj" src="http://stackoverflow."> </embed>

Your best bet to actually get the HTML is to load that content yourself:

var response = await fetch(document.getElementById('embedTag').src);