jquery 子页面控制父页面IFRAME的高度

$(window.parent.document).find("#mainFrame").css("height",""+mainFrameheigth+"px");
  jquery取得iframe元素的方法:
  收集利用Jquery取得iframe中元素的几种方法:
  Js代码
  $(document.getElementById('iframeId').contentWindow.document.body).htm()
  显示iframe中body元素的内容。
  Js代码
  $("#testId",document.frames("iframename").document).html();
  根据iframename取得其中ID为"testId"元素
  Js代码
  $(window.frames["iframeName"].document).find("#testId").html()
  作用同上
  收集网上的一些示例:
  用jQuery在IFRAME里取得父窗口的某个元素的值
  只好用DOM方法与jquery方法结合的方式实现了
  1.在父窗口中操作选中IFRAME中的所有单选钮
  $(window.frames["iframe1"].document).find("input[@type='radio']").attr("checked","true");
  2.在IFRAME中操作选中父窗口中的所有单选钮
  $(window.parent.document).find("input[@type='radio']").attr("checked","true");
  iframe框架的:
  使用jquery操作iframe
  1、内容里有两个ifame
        leftiframe中jQuery改变mainiframe的src代码:
  $("#mainframe",parent.document.body).attr("src","http://www.radys.cn")
  2、如果内容里面有一个ID为mainiframe的ifame
  
  ifame包含一个someID
  youwanttogetthiscontent
  得到someID的内容
  $("#mainiframe").contents().find("someID").html()html或者$("#mainiframe").contains().find("someID").text()值
  3、在父窗口中操作选中IFRAME中的所有单选钮
  $(window.frames["iframe1"].document).find("input[@type='radio']").attr("checked","true");
  那选择id自然就是依然使用find方法

  $(window.frames["iframe1"].document).find("#id")


jquery获取窗口高度和窗口高度,$(document).height()、$(window).height()

  1. $(document).height():整个网页的文档高度
  2. $(window).height():浏览器可视窗口的高度
  3. $(window).scrollTop():浏览器可视窗口顶端距离网页顶端的高度(垂直偏移)
  4. $(document.body).height();//浏览器当前窗口文档body的高度
  5. $(document.body).outerHeight(true);//浏览器当前窗口文档body的总高度 包括border padding margin
  6. $(window).width(); //浏览器当前窗口可视区域宽度
  7. $(document).width();//浏览器当前窗口文档对象宽度
  8. $(document.body).width();//浏览器当前窗口文档body的高度
  9. $(document.body).outerWidth(true);//浏览器当前窗口文档body的总宽度 包括border padding margin

用一句话理解就是:当网页滚动条拉到最低端时,$(document).height() == $(window).height() + $(window).scrollTop()。

当网页高度不足浏览器窗口时$(document).height()返回的是$(window).height()。

不建议使用$("html").height()、$("body").height()这样的高度。

原因:

$("body").height():body可能会有边框,获取的高度会比$(document).height()小;

$("html").height():在不同的浏览器上获取的高度的意义会有差异,说白了就是浏览器不兼容。

$(window).height()值有问题,返回的不是浏览器窗口的高度?

原因:网页没有加上<!DOCTYPE>声明。

js获取页面高度和窗口高度

实际应用:设置内容区域合适的高度

?
1
2
3
4
5
6
7
8
//设置内容区域合适高度
  var docH = $(document).height(),
    winH = $(window).height(),
    headerH = $(".header").outerHeight();
    footerH = $(".footer").outerHeight();
  if(docH<=winH+4){
    $("div.container").height(winH-headerH-footerH-50);
  }

$(window).height()     获取的是当前可视窗口的高度,也就是用户能看到的窗口的高度,是不变的(在窗口大小不变的前提下)
$(document).height()  获取的是窗口内文档的高度,这个高度随着文档内容的高度改变而改变

当窗口滚动条滚到最低端时,$(document).height() == $(window).height() + $(window).scrollTop()。
当窗口内文档高度不足浏览器窗口高度时,$(document).height()返回的是$(window).height()。

$("body").height()   如果body没有border、margin的话,$("body").height()==$(document).height(),但是还是不建议使用这种方式去获取文档内容高度

PS:如果你发现$(window).height()值有问题,返回的不是浏览器窗口的高度,那么看看是不是网页没有加上<!DOCTYPE>声明。
如果没加的话网页会进入怪异模式,你懂的!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值