iframe cross-domain auto height

inner.html

<!-- Send Height to Parent -->
<script type="text/javascript">
function sendHeight(){
  if(parent.postMessage){
    parent.postMessage({
      height: document.body.offsetHeight,
      location: window.location.toString()
    }, '*');
  }  
}
window.addEventListener('resize', sendHeight);
window.addEventListener('load', sendHeight);
</script>

outer.html

<!-- Make iframe Responsive-->
<iframe src="inner.html" frameborder="0" scrolling="no" class="f1" id="a2"></iframe>
<script type="text/javascript">
window.addEventListener('message', onResized);
function onResized(event){
  if(event.data.location){
    Array.prototype.slice.call(document.getElementsByTagName('iframe')).forEach(function(frame){
      if(event.data.location == frame.src){
        if(frame.style.setProperty){
          frame.style.setProperty("height", event.data.height + "px", "important");
        }else{
          frame.style.setAttribute("style", "height:" event.data.height + "px !important");
        }
      }
    });  
  }
}
</script>