<DOCTYPE html>
<html>
<head>
<title>Parent Page</title>
</head>
<body>
<h1 id="alter-me"></h1>
<script type="text/javascript">
/**
* Compatibility stuff for it to work in all browsers.
*/
var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
var eventer = window[eventMethod];
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";
/**
* This listens to the evcent from the child iframe page
*/
eventer(messageEvent,function(event) {
document.getElementById('alter-me').innerHTML = event.data;
},false);
</script>
<iframe src="http://somesite.com/iframe.html" style="width:930px;height:900px;border:none!important;"></iframe>
</body>
</html>
<DOCTYPE html>
<html>
<head>
<title>The iFrame file included in the above parent page</title>
</head>
<body>
<script type="text/javascript">
/**
* This will send every second
*/
setInterval(function() {
/**
* The second parameter of the postMessage method must be the same as the
* domain it is passing the message to for it to work.
*/
parent.postMessage("THE MESSAGE TO SEND TO THE PARENT PAGE", "http://parentsite.com");
}, 1000);
</script>
</body>
</html>