change html iframe src using javascript code example

Example 1: change element in iframe

// so you got an iframe (id="myiframe"). In that page you have an element id="theprice" and you want to change its value
// from the parent page do this in your javascript:
var iframevar = document.getElementById('myiframe');
var elmnt = iframevar.contentWindow.document.getElementById("theprice");
elmnt.innerHTML = theNewPrice;

Example 2: js set iframe src

<script type="text/javascript">
function iframeDidLoad() {
    alert('Done');
}

function newSite() {
    var sites = ['http://getprismatic.com',
                 'http://gizmodo.com/',
                 'http://lifehacker.com/']

    document.getElementById('myIframe').src = sites[Math.floor(Math.random() * sites.length)];
}    
</script>
<input type="button" value="Change site" onClick="newSite()" />
<iframe id="myIframe" src="http://getprismatic.com/" onLoad="iframeDidLoad();"></iframe>

Tags:

Html Example