訪問父頁面中iframe的每個元素和訪問一般的頁面元素沒有本質區別,只需要獲取需要在父頁中提前處理的iframe對象,下面是錯新技術頻道小編為大家帶來的父頁面讀取和操作iframe中內容方法,一起來看看吧!
基本的操作方法:
document.frames("frame_id").document.action;
其中,frame_id是該父頁面需要進行操作的iframe的id,action是iframe中的相關操作。
從該方法中,可以看出 document.frames("frame_id")是用來從父頁面中獲取iframe的id的,而后面的document.action同一般的腳本對頁面元素操作一樣,具體舉個例子來說明一下,其中父頁面引用iframe部分如下:
?
<div id="region1" name="region1">
<iframe onload="iframe_test()" frameborder="0" scrolling="no" width="100%" height="500" name="test_iframe" id="test_iframe" src="/testIframe.jsp" src="testIframe.jsp"></iframe>
</div>
testIframe.jsp如下:
?
?
?
<%@ page language= "java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<html>
<head>
<title>test_iframe</title>
</head>
<body>
<table class="data_form" align="center">
<tr>
<th>testname</th>
<td><input name="testname" type="text" id="testname" value="testname" ></td>
</tr>
<tr>
<th>description</th>
<td><input name="decription" type="text" id="decription" value="testname" /></td>
</tr>
</table>
<br>
<div >
<input name="fs" type="submit" id="fs" value="test" onClick="alert('test');" class="button">
</div>
</body>
</html>
父頁面中對iframe元素操作的script腳本如下:
?
?
?
<script type="text/javascript"><!--
function iframe_test(){
if (document.frames("test_iframe").document.getElementById("testname").value=="testname")
{
alert("test successful!");
}
if(document.frames("test_iframe").document.getElementById("decription").value=="")
{
document.frames("test_iframe").document.getElementById("decription").value="description"
}
}
// --></script>
此例描述了在父頁面中讀取iframe中元素以及在父頁面中修改iframe中元素的屬性。
通過此例,我們可以看出,在父頁面中訪問iframe中的各個元素與一般的訪問頁面元素無本質區別,無非是需要在父頁面中事先獲取需要處理的iframe對象,在獲取iframe對象后,其操作基本沒什么特別之處。
綜上就是錯新技術頻道小編為大家分析的父頁面讀取和操作iframe中內容方法,希望對想要了解這方面信息的人有所幫助,程序員要與時俱進,不斷學習更多的知識。