如何获取iframe中的document jquery

如何获取iframe中的document jquery,第1张

//假如有这样一个iframe

<iframe id="ifr" style="width: 100%;height:0px;  border: none" frameborder="0" scrolling="no" src=""> </iframe>

//你可以在iframe所在的页面通过如下的方法调用子页面的函数(如xxx)

$("#ifr")[0]contentWindowxxx(); //父类调用子类的方法,这样就可以在xxx函数中 *** 作子页面的dom

//子页面通过parent关键字调用父页面的函数

parentxx();

jquery获取当前元素的坐标

1,获取对象

var obj = $("#id号"); 或 var obj = $(this);

实例中我获取的对象是d出窗口按钮,这样创建的新窗口就会根椐按钮的位置进行调整,实例中将创建的新窗口显示的按钮的右下角。

2,获取对象元素的位置(offset()方法)

var offset = objoffset();

获取对象元素的位置,分别是元素的top和left,调用方法是:offsetleft和offsettop,可知当前对象的左部和顶部位置。

3,获取对象元素的宽度(width()方法)

var right = offsetleft+objwidth();

实例中是获取对象的右下角位置,创建新窗口的左部位置。

4,获取对象元素的高度(height()方法)

var down = offsettop+objheight();

实例中是获取对象的右下角位置,创建新窗口的顶部位置。

<script type="text/javascript" src="jqueryjs"></script>

<script type="text/javascript">

function t1() {

var jtest = $('#test');

var dtest = documentgetElementById('test');

jtestcss('background','blue');

/

alert(jteststylebackgroundColor='blue'); // 不好使,可证明jquery对象不是DOM对象

alert(dteststylebackgroundColor='blue');

/

}

function t2() {

var divs = $('div');

// 让你从divs中选出中国对应的DOM对象,然后改变他的背景

alert(divs[1]);

divs[1]stylebackgroundColor='red';

}

function t3() {

var div0 = documentgetElementsByTagName('div')[0]; // 选中第1个div

div0stylebackgroundColor="red";

alert('转换为jquery对象并改成蓝色');

// 直接把DOM对象以参数形式传给$方法就可以了

// 如何来理解jquery的$方法

// $方法是个包装器, 能把给的参数包装成jquery对象

// 如果给的字符串,他会先当成选择器,并根据选择器选中DOM对象,并打包

// 如果给的直接是DOM对象, 直接打包

$(div0)css('background','blue');

}

</script>

<style type="text/css">

</style>

</head>

<body>

<h1>jquery对象和DOM对象的关系</h1>

<p id="test">随便打点</p>

<div>美国</div>

<div>中国</div>

<div>英国</div>

<input type="button" value="选中test" onclick="t1();" />

<input type="button" value="jquery对象转成DOM对象" onclick="t2();" />

<input type="button" value="DOM对象转成jquery对象" onclick="t3();" />

</body>

以上就是关于如何获取iframe中的document jquery全部的内容,包括:如何获取iframe中的document jquery、用jquery如何实时获取对象的坐标、怎么把jquery对象于document对象的相互转换等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

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

原文地址:https://54852.com/web/9451638.html

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

发表评论

登录后才能评论

评论列表(0条)

    保存