javascript – 使用innerHTML属性显示另一个html文件的内容？

发布时间：2020-12-14 19:46:06 所属栏目：资源来源：网络整理

导读：我试图将我的一个元素的innerHTML设置为另一个只显示纯文本的html文件的内容.这可能吗？我正在考虑它的方式如下,但显然它只是直接将文本设置为该引用而不是显示文件的内容. document.getElementById("myElement").innerHTML = "directory/file.html" 最佳答

我试图将我的一个元素的innerHTML设置为另一个只显示纯文本的html文件的内容.这可能吗？我正在考虑它的方式如下,但显然它只是直接将文本设置为该引用而不是显示文件的内容.

document.getElementById("myElement").innerHTML = "directory/file.html"

最佳答案

您可以使用iframe标记：

</pre>
<p>您只需更改其src属性即可轻松更改iframe的内容(它将自动更新)：</p>
<p></p>
<pre><code>document.getElementById('myHtml').src = 'other_file.html';
</code></pre>
<p>如果你还想使用innerHTML来显示字符串中的html,你可以使用iframe的srcdoc属性(覆盖src属性)：</p>
<p></p>
<pre><code>document.getElementById('myHtml').srcdoc = '<div&gt;<p&gt;Some HTML</p&gt;</div&gt;';
</code></pre>
</div>
<!-- 52php.cn -->                        <p style="text-align:right;">（编辑：李大同）</p>
<p style="text-align:right;">【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!</p>
                    </td>
                  </tr>
                </table>
            </div>
            <div class="dede_pagess"><ul class="pagelist"></ul></div>
            <div class="ad-690"><script src='https://ess.0577qiche.com/d/js/acmsd/ad76.js' language='javascript'></script></div>
            <div class="g-box10">
            	<div class="t-2">相关内容</div>
<ul class="b-box12"></ul>
<ul class="b-box13"><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/267995.html" target="_blank">c# – 从Web响应中获取HTML值</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/233937.html" target="_blank">html – 使用多部分表单的缺点</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/243564.html" target="_blank">html – 链接不完全可点击</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/250414.html" target="_blank">HTML元素属性之间的换行符？</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/269566.html" target="_blank">使用jQuery.fn自定义jQuery翻页插件</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/265973.html" target="_blank">用于将HTML转换为PDF的最佳C#库？</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/271431.html" target="_blank">无法在Outlook中正确显示html电子邮件签名</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/234796.html" target="_blank">html – 浏览器中的样式自动完成下拉菜单</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/270096.html" target="_blank">js 钻石棋网页游戏代码</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/278570.html" target="_blank">jQuery生成QRcode二维码</a></li><div class="cl"></div></ul>
            </div>
        </div>
    </div>
    <div class="right-1 fr">
    	<div class="g-box8">
        <div class="t-2">推荐文章</div>
            <ul></ul>
        </div>
    	<div class="g-box11">
        <div class="t-2">站长推荐</div>
            <ul class="b-box7"><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/276238.html" target="_blank">如何使用Debian启动和运行LAMP？</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/256776.html" target="_blank">微信小程序自定义prompt组件步骤详解</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/272254.html" target="_blank">html  –  MVC 3：在ActionLink上追加get参数</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/246096.html" target="_blank">微信小程序生成自适应海报</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/278626.html" target="_blank">Web—09-正则表达式</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/262961.html" target="_blank">html – 将图像对齐到一个较小的div中央</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/235545.html" target="_blank">.net – 什么是System.Web.Mvc.MvcHandler.Proce</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/246247.html" target="_blank">vue项目微信小程序页面跳转web-view不刷新</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/263245.html" target="_blank">web-config – 如何在一个web.config中组合http和</a></li><li><a href="https://www.lidatong.com.cn/html/zhonghe/ziyuan/ziyuan/20201214/244544.html" target="_blank">.net – 保存并恢复表单的位置和大小</a></li></ul>
        </div>
        <script type="text/javascript">jQuery(".g-box8").slide({ titCell:"li",triggerTime:0 });	</script>
        <div class="ad-250"><script src='https://ess.0577qiche.com/d/js/acmsd/ad103.js' language='javascript'></script></div>
    	<div class="g-box3 u-3">
        <div class="t-1">热点阅读</div>
            <ul class="b-box2"></ul>
        </div>
        <div class="ad-250"><script src='https://ess.0577qiche.com/d/js/acmsd/ad77.js' language='javascript'></script></div>
        </div>
	<div class="cl"></div>
</div>
<div class="ad-960"><script src='https://ess.0577qiche.com/d/js/acmsd/ad78.js' language='javascript'></script></div>
<div class="footer">
<p>【免责声明】本站内容转载自互联网，其发布内容言论不代表本站观点，如果其链接、内容的侵犯您的权益，烦请提交相关链接至邮箱bqsm@foxmail.com我们将及时予以处理。</p>
<p>建议您使用1920×1080分辨率、谷歌浏览器Google Chrome、Microsoft Edge以获得本站的最佳浏览效果</p>
<p>Copygight &#169; 2008-2022 https://www.lidatong.com.cn/ All Rights Reserved. 李大同</p>
<p><script type="text/javascript" src="//js.users.51.la/21280179.js"></script></p>
</div>
</body>
</html>