rselvaganesh
rselvaganesh

Reputation: 1122

How to access dom elements of #document from embed tag?

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

enter image description here

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

enter image description here

enter image description here

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

Upvotes: 5

Views: 5206

Answers (1)

Keith
Keith

Reputation: 155692

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.com"> </embed>

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

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

Upvotes: 7

Related Questions