快捷導(dǎo)航

javascript實(shí)現(xiàn)框架高度隨內(nèi)容改變的方法

更新時(shí)間：2015年07月23日 15:10:28 作者：李榮飛

這篇文章主要介紹了javascript實(shí)現(xiàn)框架高度隨內(nèi)容改變的方法,實(shí)例分析了通過父頁(yè)面及內(nèi)容改變框架高度兩種實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下

本文實(shí)例講述了javascript實(shí)現(xiàn)框架高度隨內(nèi)容改變的方法。分享給大家供大家參考。具體如下：

有兩種方法：

一、就是通過父頁(yè)面改變

這里要理解框架的兩個(gè)屬性 contentWindow 和contentDocument 兩個(gè)屬性的意思和window document意思差不多，不同的是contentWindow 所有瀏覽器都支持，contentDocument ie6,7不支持，chrome 也不支持

<iframe onload="change_height()"></iframe>
function change_height(){
  var iframe=document.getElementById("iframe_id");
  //取得框架元素
  var i_height=iframe.contentWindow.document.body.scrollHeight||iframe.contentWindow.document.documentElement.scrollHeight;
  //取得框架內(nèi)容的高度
  iframe.height=i_height;
  //改變
}

二、就是通過內(nèi)容改變

在內(nèi)容頁(yè)進(jìn)行

window.onload=function(){
  var iframe=parent.document.getElementById("iframe_id");
  //取得框架元素
  iframe.height=document.body.scrollHeight||document.documentElement.scrollHeight;
  //取得框架內(nèi)容的高度并改變
}

希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

JavaScript模板引擎Template.js使用詳解
這篇文章主要為大家詳細(xì)介紹了JavaScript模板引擎Template.js使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-12-12
js實(shí)現(xiàn)簡(jiǎn)單的打印表格
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)簡(jiǎn)單的打印表格，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-01-01
用Webpack構(gòu)建Vue項(xiàng)目的實(shí)踐
這篇文章主要介紹了用Webpack構(gòu)建Vue項(xiàng)目的實(shí)踐，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-11-11
javascript如何讀寫本地sqlite數(shù)據(jù)庫(kù)
這篇文章主要介紹了javascript如何讀寫本地sqlite數(shù)據(jù)庫(kù)問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2023-02-02
JavaScript實(shí)現(xiàn)動(dòng)態(tài)留言板
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)動(dòng)態(tài)留言板，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-03-03
javascript中的self和this用法小結(jié)
本篇文章主要是對(duì)javascript中的self和this用法進(jìn)行了詳細(xì)的總結(jié)介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助
2014-02-02
Javascript拓展String方法小結(jié)
拓展了幾個(gè)常用的方法,需要的朋友可以參考下
2013-07-07
使用UniApp框架來阻止事件冒泡
在開發(fā)移動(dòng)應(yīng)用程序時(shí),我們經(jīng)常需要處理用戶交互事件,然而,有時(shí)候這些事件會(huì)冒泡,導(dǎo)致意外的行為和不良用戶體驗(yàn),在本文中,我們將探討如何使用UniApp框架來阻止事件冒泡,并提供一些示例代碼來幫助您理解如何實(shí)現(xiàn)這一功能,需要的朋友可以參考下
2023-11-11
動(dòng)態(tài)修改DOM 里面的 id 屬性的弊端分析
我不知道是否有什么標(biāo)準(zhǔn)規(guī)定不允許修改id屬性，或者不建議修改id屬性，總之IE對(duì)此支持不佳。
2008-09-09
Echart折線圖手柄觸發(fā)事件示例詳解
這篇文章主要給大家介紹了關(guān)于Echart折線圖手柄觸發(fā)事件的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2018-12-12