解决iframe框架，高度自适应问题

首先HTML代码

<div class="news_list">
    <iframe src="newsCenter.html" id="newsMenu" name="newsMenu" frameborder="0" width="810px" height="auto" scrolling="no"></iframe>
</div>

javascript代码（这里使用jquery,操作dom比较方便）

<script>
    window.onload = function(){
        // var obj = $('#newsMenu').contents().find('.news_list_item').outerHeight();
        // console.log(obj);
        //获取子页面的高度
        function refresh(){
            var childPageH = $('#newsMenu').contents().find('body').height();
            $('#newsMenu').height(childPageH);
            console.log(childPageH);
        }
        refresh();
        setInterval(refresh,100)
    }
</script>

延伸

• 在引入iframes框架的内部获取iframes里面的内容高度

var obj = $('#newsMenu').contents().find('.news_list_item').outerHeight(); 
$(function(){
    //获取单个新闻头的高度(包括宽度边框和边距)
    var $newsTitleH = $('.news_list_item').outerHeight();
    //获取页面中所有新闻头的个数
    var $newsTitleN = $('.news_list_item').length;
    //获取页面的显示高度
    var bodyH = $('body').height();
    //设置父级iframe框架的高度
    $(window.parent.document).find('#newsMenu').height(bodyH+'px');
    var $newsTitleH = $('.news_list_item').outerHeight();
    console.log($newst);
});