将 HTML/Javascript 代码分离成答案

【问题标题】：Separate HTML/Javascript code into将 HTML/Javascript 代码分离成
【发布时间】：2012-07-31 11:52:54
【问题描述】：

我不知道这是什么术语，但是当您使用“包含”或将 HTML 存储在变量中并调用它以在 HTML 页面中的某个点打印时，它就像 PHP。

我想更好地组织和整理我的 html 页面，这对我来说太杂乱了，我只是在我的代码中导航时感到脑雾。我没有网络服务器，一切都在运行客户端 javascript。它实际上是一个 HTA 应用程序。

例如，我想将保存在单独 .html 文件中的表调用到 Main html 文件中。

例如：

//main html file
<table>
<tr>
   <td>"call external html file here"</td>
</tr>
</table>

或者如果 jquery 或 javascript 有办法将 html 代码块存储到变量中，然后调用它以在主 html 中打印，尽管我不知道这是否会占用太多资源。我有哪些选择？

谢谢！

【问题讨论】：

【解决方案1】：

除了上面的答案之外，load 函数给了你很大的灵活性，你不仅可以插入一个 HTML 块，你还可以通过在后面添加一个空格分隔的选择器表达式，只插入该块中的一个选择部分HTML 文件的链接：

$("#tobefilled").load("foo.html #onlythiselement",function() {});

【讨论】：

【解决方案2】：

在主html文件中，可以使用诸如

之类的代码

next.body()

然后，在你要调用的文件中，可以使用诸如

之类的代码

inherit file="base.html"

调用主文件。

但这一切都取决于你使用的是哪个框架

【讨论】：

【解决方案3】：

另一个选项可能是模板，对于初学者来说：http://api.jquery.com/category/plugins/templates/

【讨论】：

【解决方案4】：

你可以使用jQueryload函数：

HTML：

<table>
    <tr>
        <td id="load"></td>
    </tr>
</table>

jQuery:

$("#load").load("http://link.to/file");

【讨论】：

【解决方案5】：

要加载外部 HTML，请使用 JQuery .load() ： http://api.jquery.com/load/

例子：

$('#result').load('ajax/test.html');

您也可以将您的 javascript 分离到另一个文件中：

<script src="yourjavascript_file.js" type="text/javascript"></script>

【讨论】：