在qq邮箱或163邮箱登录界面,怎么用js从frame里的document获取文本框

在qq邮箱或163邮箱登录界面,怎么用js从frame里的document获取文本框,第1张

iframe:

content: '<iframe id="iframe1" src="" style="" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no" allowtransparency="yes"></iframe>'

方法:

var a = documentgetElementById('iframe1')contentWindowdocumentgetElementById('a)value; //输入值

var a= documentgetElementById('iframe1')contentWindowdocumentgetElementById('a')defaultValue; //默认值

需求:在模式无障碍情况下放大后出现横向滚动条并且居中显示

收获:1给iframe的父级元素绑定事件

$('#cy_zoomAdd', windowparentdocument)on("click",function(){//给iframe的父级元素绑定事件

            $('body', windowparentdocument)css({ "overflow-x": "auto" })

            //给父级html加属性---windowparentdocument

           $("body")css({ "height": "95rem", "overflow": "hidden", "zoom": "1" });

            //给自身iframe加属性

}) 

2横向滚动条居中(滚动条居中思路)

<1 思路最开始设置滚动条左侧给一个非常大的值这样滚动条就会置顶右侧然后获取左侧的滚动条距离除以2这样赋值进去左侧距离就可以实现横向滚动条居中------- 兼容iE火狐

$(document)scrollLeft(100000);

$(document)scrollLeft($(document)scrollLeft()/2)

<2 直接写就行-----    一般在谷歌兼容性比较好的都没有问题

$(document)scrollLeft(($(document)width() - documentbodyscrollWidth) / 2);//滚动条偏移

<3 思路:横向滚动条居中=(整个页面文档的宽度-浏览器可视窗口的宽度)/2---- 就是超出一屏的内容宽度除以2

首先你要搞清楚一个概念,iframe中的是“另一个网页”,要想获取其中的DOM元素,就涉及一个跨域的问题,如果当前网页与“另一个网页”是同域(通俗来说就是同一个域名下的不同网页),那么你可以这样来获取(比如说获取body):

documentgetElementsByTagName("iframe")[0]contentDocumentbody

而如果是不同域,比如你在自己的网页用iframe来嵌套百度的首页,那就无法通过上述方法获取了,浏览器会自动拦截,因为这违反了跨域调用的规则(技术上是没问题的,只是违规了),这时候就要通过一些曲折的“民间偏方”来达到目的了,比如通过自己的后台去获取对方网页的内容(这个不会跨域),再发回给前端,具体你自己搜索,这里三言两语说不明白的。

在父窗口中获取iframe中的元素

1、

格式:windowframes["iframe的name值"]documentgetElementByIdx_x("iframe中控件的ID")click();

实例:windowframes["ifm"]documentgetElementByIdx_x("btnOk")click();

2、

格式:

var obj=documentgetElementByIdx_x("iframe的name")contentWindow;

var ifmObj=objdocumentgetElementByIdx_x("iframe中控件的ID");

ifmObjclick();

实例:

var obj=documentgetElementByIdx_x("ifm")contentWindow;

var ifmObj=objdocumentgetElementByIdx_x("btnOk");

ifmObjclick();

在iframe中获取父窗口的元素

格式:windowparentdocumentgetElementByIdx_x("父窗口的元素ID")click();

实例:windowparentdocumentgetElementByIdx_x("btnOk")click();

jquery

在父窗口中获取iframe中的元素

1、

格式:$("#iframe的ID")contents()find("#iframe中的控件ID")click();//jquery 方法1

实例:$("#ifm")contents()find("#btnOk")click();//jquery 方法1

2、

格式:$("#iframe中的控件ID",documentframes("frame的name")document)click();//jquery 方法2

实例:$("#btnOk",documentframes("ifm")document)click();//jquery 方法2

在iframe中获取父窗口的元素

格式:$('#父窗口中的元素ID', parentdocument)click();

实例:$('#btnOk', parentdocument)click();

父窗获取子窗口的IFrame中的JS方法

一、父窗口调用iframe子窗口方法

1、HTML语法:<iframe name="myFrame" src="childhtml"></iframe>

2、父窗口调用子窗口:myFramewindowfunctionName();

3、子窗品调用父窗口:parentfunctionName();

简单地说,也就是在子窗口中调用的变量或函数前加个parent就行

4、父窗口页面源码:

复制代码代码如下:

<html>

<head>

<script type="text/javascript">

function say() {

alert("parenthtml------>I'm at parenthtml");

}

function callChild()

{

//documentframes("myFrame")f1();

myFramewindowsay();

}

</script>

</head>

<body>

<input type=button value="调用childhtml中的函数say()" onclick="callChild()">

<iframe name="myFrame" src="childhtml"></iframe>

</body>

</html>

5、子窗口页面:

复制代码代码如下:

<html>

<head>

<script type="text/javascript">

function say()

{

alert("childhtml--->I'm at childhtml");

}

function callParent() {

parentsay();

}

</script>

</head>

<body>

<input type=button value="调用parenthtml中的say()函数" onclick="callParent()">

</body>

</html>

二、iframe 父窗口和子窗口相互的调用方法

1、IE中使用方法:

父窗口调用子窗口:iframe_IDiframe_document_objectobject_attribute = attribute_value

例子:onClick="iframe_textmyH1innerText='>

要解释这个问题,首先要解释两个技术点。

每个“窗口”都是一个JS Runtime,即JS的运行时。如果只有一个窗口,那么就只有一个Runtime;如果一个窗口下面还有一个iframe,那么就有两个Runtime;以此类推。

Runtime之间互 *** 作(或者通信)是有跨域限制的。也就是说,如果这个窗口本身是abaiducom域名下的页面,那么如果这个页面下还有一个iframe,这个iframe中加载的页面是bbaiducom域名下的。那么外层的JS。就不能跟这个iframe中的内容互 *** 作(或者通信)。

因此外层Runtime中的JS想 *** 作内层iframe中的内容,就必须要避免跨域限制。要么内层iframe加载页面的域名跟外层是一样的。要么就是需要在内层iframe加载的页面中执行documentdomain = 'baiducom';从而设置跟外层的主域相同。

例如,当前页面是abaiducom/testhtml

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

<html>

<head>

</head>

<body>

<iframe id="iFrm1" src="

<script>

documentdomain = 'baiducom';

var ifrm1 = documentgetElementById('iFrm1');

ifrm1onload = function(){

alert(ifrm1contentWindowdocumentgetElementById('innerDiv')innerHTML);//d出恭喜你 *** 作到内部iframe中的元素了!!!

};

</script>

</body>

</html>

iframe中加载的页面内容如下:

1

2

3

4

5

6

7

8

9

10

<html>

<head>

</head>

<body>

<div id="innerDiv">恭喜你 *** 作到内部iframe中的元素了!!!</div>

<script>

documentdomain = 'baiducom';

</script>

</body>

</html>

在HTML5中新增了postMessage的API。可以方便窗口跟内部iframe之间进行通信,并且可以实现跨主域通信。但是有一些限制,1老版本的浏览器一般不支持。2父窗口只能向iframe中发送信息,iframe只能收消息,且父窗口不能直接 *** 作iframe中的内容。3父窗口发送的数据也是有限制的。只能发送基本数据类型或者plain object。

同域或跨子域读写 *** 作 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>

以上就是关于在qq邮箱或163邮箱登录界面,怎么用js从frame里的document获取文本框全部的内容,包括:在qq邮箱或163邮箱登录界面,怎么用js从frame里的document获取文本框、iframe *** 作父级页面事件-window.parent.document、"如何获取#document"下的DOM元素等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/web/9556177.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-29
下一篇 2023-04-29

发表评论

登录后才能评论

评论列表(0条)

保存