JavaScript 怎么跨域获取 iframe 中的内容

JavaScript013

JavaScript 怎么跨域获取 iframe 中的内容,第1张

如果 iframe地址与当前页面地址同域,js可以访问该页面内的对象.

使用 window.frames[0] 或者window.frames[name] 来访问frame的window对象

如要获取元素,使用 window.frames[0].document.getElementById

另外 ,ie系列和webkit系列可能访问方法上略有区别,具体可调试查看

A域名下的页面index.htm中内嵌了一个iframe页面,iframe内引用的是B域名的sub-index.htm页面,但是为了避免出

现在index.htm页面中出现滚动条,需要明确知道sub-index.htm页面的高度和宽度,可是sub-index.htm的页面内容是不可控的,可能会根据不同用户页面大小会不一样;问题就是如何把sub-index.htm页面的高度和宽度传递给index.htm页面?

具体解决:

1、在index.htm页面中声明一个js函数process(height, width)用来实现设置页面内iframe的高度和宽度;

2、

在sub-index.htm页面中再内嵌一个隐藏的iframe,iframe的src指向A域名下的页面ex.htm?height=xx&

width=yy,该页面没有任何内容,只是用来传递sub-index.htm页面加载完之后的宽度和高度这两个数据的,页面内js拿到request

中的参数之后直接调用parent.parent.process(height, width)完成对父页面宽度和高度的设置;

如图:

父页里有一个层<div>,<div>里有一个子框架<iframe>,<iframe>的属性id="mainFrame"

例如:

父页代码:

<html>

<body>

<div id="mainDiv" style="display:nonewidth:550pxheight:200px" align="left">

<iframe name="mainFrame" src="./AllLanguageAction.do" frameborder="0" scrolling="no" width="550" height=250 id="mainFrame">

</iframe>

</div>

</body>

</html>

子页中代码:

<html>

<head>

<script type="text/javascript">

function IFrameResize()

{

var obj = parent.document.getElementById("mainFrame")

obj.height = this.document.body.scrollHeight

}

</script>

</head>

<body onload="IFrameResize()">

</body>

</html>