jQuery – read and modify iframe content

Sometime we need to read and modify same domain iframe content using jQuery. Here is code snippet which will modify the content of an iframe.

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>

<iframe id="iframe1" src="/demo2/ihello.html"></iframe>

<script type="text/javascript">
$(window).load(function() {
  var iframeDoc = $("#iframe1")[0].contentWindow.document;
  var $jqObject = $(iframeDoc).find("body");
  var iframeHtml = $jqObject.html();
  $jqObject.html(iframeHtml + "<br/>appended text from jquery");
Share this article: share on Google+ share on facebook share on linkedin tweet this submit to reddit


Click here to write/view comments