如何将HTML与Javascript / jQuery分开？

Question

我有一个论坛，在每个人的帖子上都有一个按钮，允许主持人在查看使用简单模式在窗口中静音的帖子/输入时间后使其静音。 在显示窗口的代码中，我有很长的代码，例如

var output = "<div id='msginfo'>...</div>";

等等。 我希望我的代码在使用完后能够被“缩小”，并且当涉及到html（通常是<和“>东西）时，很多打包程序/压缩程序会淘汰掉。

其他Web应用程序如何不管理JavaScript文件中的HTML？ 是将显示的div隐藏起来，直到需要它们还是什么？

Answer 1

在工作中，我为此使用ICanHaz 。 它使您可以从HTML模板（可以将其包含在HTML文件的<head>中）动态生成DOM元素，而不必在JavaScript中内联任何难看且难以阅读的HTML。

对于您这样的目的-显示具有固定布局的模式-这可能比在加载页面时在页面上包含和隐藏模式更干净，尽管在这种情况下，后一种解决方案可能也没有什么大不了的。

顺便提及，当您要在页面加载后异步向页面添加内容时，ICanHaz也是一个不错的解决方案，这在论坛上下文中可能是相关的（例如，在不加载新页面的情况下加载新帖子）。

Answer 2

我通常将divs： display:none属性隐藏起来，然后在需要时用Javascript更改它，以便显示它们。

另一方面，您可以调用Ajax并获取所需的html并显示将其附加到元素上。