Home > Web Front-end > JS Tutorial > Sample code sharing on how to use JavaScript to dynamically change the src attribute of an iframe

Sample code sharing on how to use JavaScript to dynamically change the src attribute of an iframe

黄舟
Release: 2017-07-21 13:25:17
Original
3179 people have browsed it

How to use JavaScript to dynamically change the src attribute of an iframe. Sample code sharing

<iframe id="xx"></iframe>
<iframe id="yy"></iframe>
<script>


var xxObj = document.frames;
xxObj[0].src="index.htm";

</script>
Copy after login

iframeID.location=newURL

<iframe id="myIframe"></iframe>

<script language="javascript">
myIframe.src = "index.htm";

</script>
Copy after login

document.frames[0].location.href =url ;

window.frames["iframeName attribute"].location.href="xxxx.asp"

frames.youname.src = url;

<iframe id="xx" src=""></iframe>

document.getElementById("xx").src="xx.htm";
Copy after login

or

document.getElementsByTagName("iframe")[0].src="xx.htm";
Copy after login

In my impression, cross-domain is not allowed

My admiration for everyone upstairs is like an endless river.

document.frames[0].navigate("about:blank");
Copy after login

The window object has the navigate() method to redirect to the specified URL. . .

The src of iframe can definitely be changed. It is estimated that the original poster failed because the obtained iframe object was incorrect.
top.document.all("Your iframe's ID/name").src=your address; This should be used in IE, but I recommend that for better compatibility, the iframe has both id and name. And to obtain the object, use the following compatibility code

function lib_bwcheck(){ 
this.ver=navigator.appVersion; 
this.agent=navigator.userAgent
this.dom=document.getElementById?1:0
this.win = (navigator.appVersion.indexOf("Win")>0);
this.xwin = (navigator.appVersion.indexOf("X11")>0);
this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom)?1:0;
this.ie4=(document.all && !this.dom)?1:0;
this.ie=this.ie4||this.ie5||this.ie6
this.mac=this.agent.indexOf("Mac")>-1
this.opera5=this.agent.indexOf("Opera 5")>-1
this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0; 
this.ns4=(document.layers && !this.dom)?1:0;
this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5 || this.dom||false);
this.width = null;
this.height = null;
return this
}
function getObjectById( ID ) {
var bw = new lib_bwcheck();
if (bw.ns6) return document.getElementById(ID);
else if (bw.ns) return document.layers[ID];
else return document.all[ID];
}
Copy after login

both

top.document.all("你的iframe的ID/name").src=你的地址;变成
getObjectById( "你的iframe的ID/name" ).src=你的地址;
Copy after login

According to the method provided by the heroes, you can change the url, thank you very much! Another problem I have here is that I first need to change the url of the parent page (without opening a new page), and then change the src of the iframe in the page. I hope you can provide further support!
The method I use is:

window.location =parentUrl;
document.getElementById("upperPage").src=child1Url;
document.getElementById("bottomPage").src=child2Url;
Copy after login

This way I cannot change the src attribute of the iframe. If I remove window.location =parentUrl;, I can change the src attribute! Please experts continue to enlighten me! Kindness without saying thanks! ! !

Are you sure there is an iframe like upperPage in the new page?

ice_berg16 (the dream-seeking scarecrow), can you give me a solution? I want to change the url of the current page, and also modify the src attribute of the iframe inside it. Thank you very much!



The above is the detailed content of Sample code sharing on how to use JavaScript to dynamically change the src attribute of an iframe. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template