iframe是在页面中嵌套的子页，当前页面（这里称为父页）和嵌套页面（这里称为子页）可以相互控制：
当父页控制子页用contentWindow，用法为 对象.contentWindow.document.XX 或用contentDocument.XX 来操作
子页控制父页用window.parent.document.XX 如果是多层嵌套想直接操纵祖先页面就用 window.top.document.XX
<!DOCTYPE HTML>
<html>
<head>
<title>HTML5实现拖拽操作</title>
<meta charset="utf-8"/>
<style>
</style>
<script>
window.onload=function(){
var oinput=document.getElementById('input1');
var oif=document.getElementById('f1');
oinput.onclick=function(){
//alert(oif.contentWindow.document.getElementById('d1'));
//contentWindow全部浏览器都支持
//contentDocument 浏览器IE6，IE7不支持
oif.contentDocument.getElementById('d1').style.color='red';
//oif.contentWindow.document.getElementById('d1').style.color='red';
};
}
</script>
</head>
<body>
<input type='button' value='点我' id='input1'/>
<iframe src='iframe1.html' id='f1'> </iframe>
<div id='d1'>通过子更改我的背景色 </div>
</body>
</html>
本实例牵扯到父页和多个子页，多重嵌套，要用到多个页面的多篇代码，原理很好理解，但要精确表达出却很困难，其核心知识就是开头介绍的几个方法。总之今天学的东西很多很杂，代码多次更改没有合理保存，以后不急不躁，一步一个脚印。
补充：禁止别人以iframe加载你的页面
if (window.location != window.parent.location) window.parent.location = window.location;