34

I though this would be simple enough but I can't find the answer. I need to know how I can access an iframe's name from within said iframe. I was trying something like this but it's not working.

<iframe name="thename">
  <script type="text/javascript">
    alert(parent.name);
  </script>
</iframe>
Ilia Choly
  • 18,070
  • 14
  • 92
  • 160

5 Answers5

64

There is a combination of answers I prefer:

// window.frameElement Gets IFrame element which document inside
window.frameElement.getAttribute("Name");

It works on IE7+, Mozilla & Chrome

efirat
  • 3,679
  • 2
  • 39
  • 43
  • 3
    I like this answer more than the accepted answer because it references the actual iframe element. – keyneom Aug 17 '13 at 03:32
  • this not work on http://publisherconsole.appspot.com/safeframe/creative-preview.html, any suggestions? – PayteR Sep 08 '17 at 18:55
  • 1
    MDN documentation: [`Window.frameElement`](https://developer.mozilla.org/en-US/docs/Web/API/Window/frameElement) – dakab Mar 18 '22 at 18:24
62

You were nearly right. Setting the name attribute on a frame or iframe sets the name property of the frame's global window object to that string. (Not parent, which refers to the window of the document that owns the frame.)

So unless some other script has deliberately changed the name, it's as simple as:

1.html:
<iframe name="tim" href="2.html"></iframe>

2.html:
<script type="text/javascript">
    alert(window.name); // tim
</script>
bobince
  • 528,062
  • 107
  • 651
  • 834
  • 8
    how about accessing attributes of the iframe? for example if it has some data-set attr? – AlexStack Jan 21 '14 at 09:15
  • 15
    @AlexStack: `window.frameElement` gets you the element from the parent document that refers to yourself, you can then `getAttribute` on it (assuming you have SOP access). See http://stackoverflow.com/questions/4097870/jquery-access-iframe-id-from-iframe-content/4098384#4098384 for fallback where not available – bobince Jan 21 '14 at 10:14
9

in some cases window.frameElement returns null in iframe, so i figured workaround for it.

1. you need to set hash in src url of iframe

<iframe name="tim" href="2.html#your-hash"></iframe>

2. in iframe you can get this hash with

<script type="text/javascript">
    var hash = window.location.hash;
</script>
PayteR
  • 1,727
  • 1
  • 19
  • 35
4

Well, an IFRAME element shouldn't contain anything, it's targeting another document. So using a SCRIPT tag inside an IFRAME doesn't make alot of sense. Instead, use the SCRIPT inside the called document, e.g.

iframe_caller.html:

<html>
 <body>
  <iframe id="theIframe" name="theIframe" src="iframe_doc.html"></iframe>
 </body>
</html>

iframe_doc.html:

<html>
 <body>
  <script type="text/javascript">
    var iframes= parent.document.getElementsByTagName("iframe");
    document.write(iframes[0].getAttribute("id"));
  </script>
 </body>
</html>

Note I'm using parent.document.function() there.

bdl
  • 1,504
  • 12
  • 16
0

Something like this should work:

parent.document.getElementById('idhere').name;

You have to use the parent and then get the element either byId, Name, etc... then access the name property.

So your code should be like:

<iframe name="thename">
 <script type="text/javascript">
   var iframeName = parent.document.getElementById('idhere').name;
 </script>
</iframe>
Todd Moses
  • 10,969
  • 10
  • 47
  • 65