本文展示了如何在HTML中嵌套iframe并利用JavaScript进行跨域操作，通过实例介绍了初始化参数、操作iframe内的DOM元素及与其他窗口的交互。
main window html
<div id="abbreviative">
<iframe src="tree-min.html" width="100%" height="100%" name="MyIFrame" id="MyIFrame" frameborder='no' scrolling="no" left="0" top="0"></iframe>
</div>
<script type="text/javascript">
///alert('中断...');
</script>
<script type="text/javascript" src="../../jquery/bundle/jquery-1.7.2.js"></script>
<script type="text/javascript" src="scripts/test.js"></script>
<div id="sample1"></div>
javascript
/*** 新增加的功能:初始化参数，参数包括iframe的document和window,对于html,可以使用document操作，函数方法，可以使用window操作
*/var ifDoc = null;
var ifWin = null;
init = function(){
console.log('进来 了？');
if (document.all){//IE
ifDoc = document.frames["MyIFrame"].document;
ifWin = document.getElementById("MyIFrame").window;
}else{//Firefox
ifWin = document.getElementById('MyIFrame').contentWindow;
ifDoc = document.getElementById('MyIFrame').contentDocument || document.getElementById('MyIFrame').contentWindow.document;
}
}
$(function(){
init();
//alert(nodeid+', '+upd);
//ifDoc.getElementById("sample1").style.background="red";;
ifWin.t.collapseNode(nodeid, upd);
})
tree-min.html
<script type="text/javascript">
testOne = function(){
alert('hello,World!!!');
}
var t = null;
testFn = function(){
alert('调用子窗口成功!');
}
var parw = window.parent;
$(function(){
parw.test();
var items = $(parw.document).find('.toggle');
items = $(parw.document.body).find('a');
$(items).bind('click',function(){
console.warn(this);
});
})
</script>
<body>
<div id="sample1"></div>
<div id="move-div"></div>
</body>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
