如何在iFrame中导出HTML文件

时间:2015-05-21 06:42:33

标签: javascript jquery html

我只想导出iFrame中加载的网页。但是我希望从外部iFrame中获取动作。

这是我的代码澄清事情:

<html>
    <body>
        some contents here....
        <div id="main">
            <iframe id="myiframe" src="template/index.html"></iframe>
        </div>
        <a href="#" id="downloadLink">Export</a>
        <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function(e) {
                function downloadInnerHtml(filename, elId, mimeType) {
                    var elHtml = document.getElementById(elId).innerHTML;
                    var link = document.createElement('a');
                    mimeType = mimeType || 'text/plain';

                    link.setAttribute('download', filename);
                    link.setAttribute('href', 'data:' + mimeType + ';charset=utf-8,' + encodeURIComponent(elHtml));
                    link.click(); 
                }
                var fileName =  'newlstter.html';
                $('#downloadLink').click(function(){
                    downloadInnerHtml(fileName, 'main','text/html');
                });
            });
        </script>
    </body>
</html>

当我点击export按钮时,HTML文件将被导出,它将包含iFrame。但是如果我在内部HTML文件中使用这些代码,它将导出。 但是我需要从outter站点导出当前的HTML页面。完全像我上面的代码。但我只想导出内部HTML。

任何人都可以给我一些建议吗? 注意:我需要jQuery或JS代码,而不是PHP。

谢谢!

1 个答案:

答案 0 :(得分:0)

我建议使用AJAX;以下小提琴只返回您需要的HTML:https://jsfiddle.net/yLL48one/2/

$.get( "/yLL48one/1/", function( data ) {
    console.log( data );
});