简体繁体 English

如何加载外部html文件？

[英]How can I load external html files?

原文 2017-04-26 14:55:26 5 2 javascript/ jquery/ html

I need to make changes to an existing project that uses iFrames to dynamically load external html files. 我需要对使用iFrame动态加载外部html文件的现有项目进行更改。 However, the html files are part of the same project, not external sites. 但是，html文件是同一项目的一部分，而不是外部站点的一部分。 If I'm not mistaken, iFrames are considered a terrible way of loading html content unless they are used to actually display external sites. 如果我没记错的话，iFrame被认为是加载html内容的一种糟糕方法，除非它们实际上用于显示外部网站。

I have looked into web components but apparently, browser support is still spotty and unfortunately, I need to support IE9. 我研究了Web组件，但显然，浏览器支持仍然参差不齐，不幸的是，我需要支持IE9。

I know that the JQuery load() method can accomplish this but in my online research, that doesn't often come up as a proper way of loading external html in general and a proper replacement for iFrames in particular. 我知道JQuery load()方法可以完成此任务，但是在我的在线研究中，通常不将其作为加载外部html的适当方法，尤其是iFrame的适当替代方法。

Is there a reason why JQuery shouldn't be used here and are there better and established ways of doing this? 是否有理由不应该在这里使用JQuery，并且有更好的既定方法呢？ For example, I once saw a framework that dynamically built the interface out of separate "partials" but I don't remember which framework that was. 例如，我曾经看到过一个框架，该框架是根据单独的“部分”动态构建接口的，但我不记得是哪个框架。

2 个解决方案

It depends on the HTML - 这取决于HTML-

If it's built like a full page - then iFrames are actually a decent solution - Also, iframes with the same origin let you have full control over the content from the parent, while still protecting CSS and JS variables which is pretty convenient. 如果它的构建像整页一样-那么iFrame实际上是一个不错的解决方案-而且，具有相同来源的iframe可以让您完全控制来自父级的内容，同时仍然可以保护CSS和JS变量，这非常方便。

If not - jQuery.load() will do the trick, you can also do it manually ofc, but if you already have jQuery in your project, just use it. 如果不是这样，则jQuery.load（）可以解决问题，您也可以手动执行ofc，但是如果您的项目中已有jQuery，则只需使用它即可。

load（）函数几乎总是最好的方法，如果使用该函数遇到特定问题，也许可以共享？