0

I have a embed code from instagram, that inserting a photo on my page, then I need to select the image src of this photo with querySelector from my JS-plugin connected to page

But when I try to make selections with JS there are no results after page loaded.

document.getElementsByTagName('img');
> HTMLCollection [img.sarafan-pixel]

example I try 

document.querySelectorAll('img');
document.getElementsByTagName('img');

And there are no images from insta...

But then i goes to Elements in devtools and click on it with selector tool, find this code in DOM and go back to console, there are some results for this img, what a strange behavior?

document.getElementsByTagName('img');
> HTMLCollection(5) [img, img.EmbeddedMediaImage, img, img, img]

May be there are another ways to get src of instagram photo embedded on page?

Evgeny Gil
  • 187
  • 1
  • 13
  • It is likely in an iFrame which is not part of your document. If you inspect it you will see ` – mplungjan Feb 05 '19 at 06:39
  • Oh yes, noticed, but I can't access to this document from my parent, when i try to select img's inside it `document.getElementById('instagram-embed-0').contentWindow.document.getElementsByTagName('img')` it show error - `Blocked a frame with origin "http://widget.local" from accessing a cross-origin frame` – Evgeny Gil Feb 05 '19 at 06:56
  • That is a normal security feature - you cannot access cross origin as it clearly states – mplungjan Feb 05 '19 at 06:56
  • Thx, Is there a way to solve this case? – Evgeny Gil Feb 05 '19 at 06:58

0 Answers0