Pulling Stylesheet src/href from an external file, JQuery/Javascript

Question

Say I have an html source and I know the URL, "example_url.html". This html file has a < link href="style.css" rel="stylesheet"/> .

This is an iframe's src I am using in another view, and I want to pull the stylesheet listed in "example_url.html". How do I go about that?

And I don't know the actual href of stylesheet, and it changes based on various factors (but everything shares a domain name). I'll need it as a variable.

Answer 1

Assuming you give the iframe an ID, I think something like this should work:

var iframe = document.getElementById("the-iframe-id");
var child_doc = iframe.contentDocument || iframe.contentWindow.document;
var child_links = child_doc.getElementsByTagName("link");
var child_css;
for (var i = 0; i < child_links.length; i++) {
  if (child_links[i].rel == "stylesheet") {
      child_css = child_links[i].href;
      break;
  }
}