Get title from IFrame document

Question

This is my code:

<div id="main-content">
    <script>
        document.title = document.getElementById("main-content-iframe").contentDocument.title;
    </script>
    <iframe name="cstage" src="home.html" width="100%" height="100%" id="main-content-iframe" frameborder="0" onload="document.title=parent.frames['cframe'].document.title;">If you're seeing this message, it means IFrames are not supported; Please enable IFrames or upgrade to a compatible browser that supports IFrames.</iframe>
</div>

It's not working, what am I doing wrong?

Solution

You need to check that the iframe is loaded.

<div id="main-content">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <iframe name="cstage" src="home.html" width="100%" height="100%" id="main-content-iframe" frameborder="0" onload="document.title=parent.frames['cframe'].document.title;">If you're seeing this message, it means IFrames are not supported; Please enable IFrames or upgrade to a compatible browser that supports IFrames.</iframe>
<script>
    $( "iframe" ).on('load',function() {
        document.title = document.getElementById("main-content-iframe").contentDocument.title;
    });
</script>

Comments

[Ken Sharp]

It's hardly "useless", now is it?

[james walker]

@ Kalle H. Väravas ..gives an alternate approach.... sometimes it IS a solution for some.. @KenSharp .. Vote up ..'cuz the SO thought it was right too!!

[UnrealApex]

@SuperJumpBros contentWindow does not return the document, rather it only allows you to access the iframe's document. contentWindow returns the Window object, not the document. The window is what the document is contained in, but you cannot use this just to access the iframe.