同域或跨子域读写 *** 作 iframe 里的内容
父页面读写 *** 作子页面:
HTML code<iframe id="test-iframe" name="test-iframe" src="childhtml" scrolling="no" frameborder="0"></iframe>
<script>
windowonload = function () {
/
下面两种获取节点内容的方式都可以。
由于 IE6, IE7 不支持 contentDocument 属性,所以此处用了通用的
windowframes["iframe Name"] or windowframes[index]
/
var d = windowframes["test-iframe"]document;
dgetElementsByTagName('h1')[0]innerHTML = 'pp';
alert(dgetElementsByTagName('h1')[0]firstChilddata);
}
</script>
呃,就是把iframe所嵌页面的元素id传回主页面么?
//iframe页定义一个函数,这个标记是定义在iframe页面里的function sendPage(){
windowparentjumpPage('标记');
}
//主页面获取标记,并跳转页面
function jumpPage(page){
//跳转页面
switch(page){
case 'xxx':
//do jump
break;
}
}
调用的时候,在iframe里面的页面调用sendPage函数就可以执行外层的跳转啦。。。
可以下面是一个iframe自适应高度的例子,里面有获取iframe body高度的代码
<script language="JavaScript" type="text/javascript">
function SetWinHeight(obj)
{
var frmright=obj;
if (documentgetElementById)
{
if (frmright && !windowopera)
{
if (frmrightcontentDocument && frmrightcontentDocumentbodyoffsetHeight){
frmrightheight = frmrightcontentDocumentbodyoffsetHeight;
frmrightwidth = frmrightcontentDocumentbodyoffsetWidth;
}else if(frmrightDocument && frmrightDocumentbodyscrollHeight){
frmrightheight = frmrightDocumentbodyscrollHeight;
frmrightwidth = frmrightDocumentbodyscrollWidth;
}
}
}
}
</script>
<IFRAME id=pr name=pr marginWidth=0 marginHeight=0 src="proasp" frameBorder=0 onload="Javascript:SetWinHeight(this)" width=540 scrolling=no height="100%"></IFRAME>
JS获取/设置iframe内对象元素、文档的几种方法
1、IE专用(通过frames索引形象定位):
复制代码 代码如下:
documentframes[i]documentgetElementById('元素的ID');
2、IE专用(通过iframe名称形象定位):
复制代码 代码如下:
documentframes['iframe的name']documentgetElementById('元素的ID');
以上方法,不仅对iframe适用,对frameset里的frame也同样适用。IE虽然擅于自定标准,但不得不说它很多的设计还是比较体现人性化的。比如这个,它在同样支持下面的标准路径之外,提供了一个简洁且形象化的写法。
3、通用方法:
复制代码 代码如下:
documentgetElementById('iframe的ID')contentWindowdocumentgetElementById('元素的ID')
注意要加上contentWindow,往往出现问题都是因为这个容易被忽略,它代表frame和iframe内部的窗口对象。
JS获取iframe文档内容
复制代码 代码如下:
<script type="text/javascript">
function getIframeContent(){ //获取iframe中文档内容
var doc;
if (documentall){ // IE
doc = documentframes["MyIFrame"]document;
}else{ // 标准
doc = documentgetElementById("MyIFrame")contentDocument;
}
return docbodyinnerHTML;
}
</script>
注意:上面的 contentDocument 相当于 contentWindowdocument !
一、需求与遇到的问题
在网站的后台管理中使用了iframe框架布局,包括顶部菜单、左侧导航和主页面。需求是:点击主页面上的一个按钮,在顶部菜单栏的右侧显示“退出”链接,点击可退出系统。
我的思路是:在顶部的菜单页面放一个不可见的“退出”链接,当用户点击位于iframe中的主页面(mainPagehtm)中的按钮时,在顶部菜单页面的右侧显示“退出”。
我现在遇到的问题是:如何在页面的一个iframe子页面(mainPagehtm)中获取并且 *** 作其它iframe子页面(比如topPagehtm)中的HTML元素?
二、通过JS获取并 *** 作iframe中的元素来解决问题
这里主要就是通过JS来 *** 作Window对象。Window 对象表示浏览器中打开的窗口,如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外的 window 对象。
经过我在网上查资料,找到了JS *** 作iframe中HTML元素的方法。示例如下。
复制代码 代码如下:
function ShowExit() {
//获取iframe的window对象
var topWin = windowtopdocumentgetElementById("topNav")contentWindow;
//通过获取到的window对象 *** 作HTML元素,这和普通页面一样
topWindocumentgetElementById("exit")stylevisibility = "visible";
}
说明:第一步,通过windowtopdocumentgetElementById("topNav")方法获取了顶部菜单页面(topPagehtm)所在的iframe对象;第二步,通过上一步获取到的iframe对象的contentWindow属性得到了iframe中元素所在的window对象;第三步,通过上一步获取到的window对象来 *** 作iframe框架中的元素,这和 *** 作不在iframe框架中的普通HTML元素是一样的。
以上就是关于html获取iframe内的数据全部的内容,包括:html获取iframe内的数据、extjs显示页面我使用html属性:然后引用一个iframe页面显示在页面中怎么获取iframe页面中某一标记的id、给iframe赋ID后,用js是否可以通过此ID获取引用页面body的高度等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)