操作iframe中的DOM元素

2007-12-21 11:34 | Filed Under Html/JS/CSS |

操作iframe中的DOM元素，有两个注意点：
1、必须先获取指定iframe的document；
2、对于1，必须在页面load完以后才能获取；

举例说明：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>操作iframe中的DOM元素</title>
<script type="text/javascript">
<!--
//返回指定iframe的document
function getIFrameDocument(aID) {
var rv = null;
if (document.getElementById(aID).contentWindow.document){
// if contentDocument exists, W3C compliant (Mozilla)
rv = document.getElementById(aID).contentWindow.document;
} else {
// IE
rv = document.frames[aID].document;
}
return rv;
}
function bindEvents() {
var iDocument = getIFrameDocument('test');
//接下来就可以进行类似的DOM操作了
var map = iDocument.getElementById('map');
//……
}
//-->
</script>
</head>
<body onload="bindEvents()">
<iframe id="test" name="giscontent" src="iframe.html" frameborder="0" scrolling="no">
</iframe>
</body>
</html>