javascript - 使用链接将 HTML 文件加载到 DIV 中

标签 javascript html

有几个主题与此有关,但没有一个能完全回答我的问题。

我希望能够有一个将整个 HTML 文件加载到 DIV 中的链接。

例如,这将仅将文本加载到我的“MainBack”DIV 中。它工作正常:

<a href="#computing" onclick="document.getElementById('MainBack').innerHTML = '<p>1</p>';">Computing</a>

但我想像这样将整个文件加载到其中:

<a href="#computing" onclick="document.getElementById('MainBack').innerHTML = 'HTML FILE';">Computing</a>

有什么建议吗?我对此很陌生!

最佳答案

您可以使用 <iframe>这样做:

<iframe src="link.html" width="100%" height="300"></iframe>

Live Demo

代码:

<a href="#computing" onclick="document.getElementById('MainBack').innerHTML = '<iframe src=\'http://www.google.com\' scrolling=\'no\' frameborder=\'0\' width=\'100%\' height=\'600px\'></iframe>'">Computing</a>

或者你可以使用 lightbox 以非常漂亮的方式做到这一点......

它会显示;照片、视频、HTML...基本上任何你想要的东西。

关于javascript - 使用链接将 HTML 文件加载到 DIV 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4986967/

相关文章:

javascript - 累加器在 Javascript 的 reduce 函数中返回 NaN

java - 如何使用 Java 或 Javascript 将 ASCII Art 解析为 HTML?

html - 如何加载自定义字体?

jquery - 当 HTML 行单元格为空时如何缩小或隐藏?

javascript - 当你在 json 中有两行时,如何解决意外的 token 错误?

javascript - 在正则表达式中使用变量 (jQuery)

javascript - 使用 Jcrop 裁剪上传的图像

javascript - 如何通过 id 选择嵌套在另一个 div 中的 div?

javascript - 了解 canvas Clip() 如何影响多个动态创建的形状

html - 用于文本旋转的 CSS3 与 Canvas