先看一个例子
<!doctype html> <html> <head> <meta charset="utf-8"> <title>demo</title> </head> <body> <form name="form1"> <div> <iframe name="query" src="test2.html"></iframe> </div> <div id="newIframe"> <iframe name="theID"></iframe> </div> </form> <form name="jumpform" target="theID" action="test2.html"> <input type="submit" value="提交" /> </form> </body> </html>
子页面
<!doctype html> <html> <head> <meta charset="utf-8"> <title>demo</title> </head> <body> BEN Hello! </body> </html>
name是theID的iframe中显示了。
target属性：
_blank——新开窗口
_self——自身
_top——主框架
_parent——父框架
自定义名字——出现于框架结构，将会在该名称的框架内打开链接
很多时候需要动态创建iframe
但是在IE下，通过JS创建一个iframe object，对其name属性的赋值操作将被忽略。
解决办法：在IE和其他browser下可以通过以下方式创建iframe。
var iframe;
try { // for I.E.
iframe = document.createElement('<iframe name="fileUploaderEmptyHole">');
} catch (ex) { //for other browsers, an exception will be thrown
iframe = document.createElement('iframe');
}
实例2
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>demo2</title>
<script type="text/javascript">
window.onload = function(){
var obj = null;
try{
obj = document.createElement('<iframe name="theID">');
}catch(ex){
obj = document.createElement('iframe');
obj.name = 'theID';
}
var oDiv = document.getElementById('newIframe');
oDiv.appendChild(obj);
}
</script>
</head>
<body>
<form name="form1">
<div>
<iframe name="query" src="test2.html"></iframe>
</div>
<div id="newIframe">
</div>
</form>
<form name="jumpform" target="theID" action="test2.html">
<input type="submit" value="提交" />
</form>
</body>
</html>