0

例如，我有个人资料页面并使用“关于”、“照片”、“视频”部分等进行选择，并且我不想每次更改部分时都刷新页面，我只想更改容器的内容Javascript。当然，在 Javascript 文件中编写页面标记并不方便，我的想法是编写每个视图的 div 并仅显示其中一个：

<div id="about>About content</div>

<div id="photos" style="display: none;">Photos content</div>

但是，我认为有更好的方法可以做到这一点，因为我不喜欢在页面上保留隐藏视图。同样在大多数情况下，视图中的内容应该由脚本生成，所以它看起来像是模板引擎的工作，但我不确定 Javascript 中是否有这样的内容。

那么在 Javascript 中实现这一点的最佳方法是什么。我希望我的想法很清楚。提前致谢！

4

2 回答 2

2

尝试使用mustache它是 javascript 的模板引擎。

此外，您可以使用AngularJS模板（按需动态加载到页面中），非常易于使用。（但是包含您可能不想要的其他东西......但应该想要;））

于 2012-12-17T16:47:54.233 回答
1

每当用户单击链接时，使用 jQuery 获取视图。

比如绑定点击事件：

$('#clickToSeePhotos').click(function(){
    $('#photosContainer').load('pathTo/photos.html');
});

$('#clickToSeeAbout').click(function(){
    $('#aboutContainer').load('pathTo/about.html');
});

这是html：

<a id="clickToSeePhotos" href="#">Photos<a/>
<div id="photosContainer"></div>

<a id="clickToSeeAbout" href="#">About<a/>
<div id="aboutContainer"></div>

这是 jQuery 页面的链接，他们在其中提供了更多信息和示例load http://api.jquery.com/load/

您可以下载 jQuery 库并在您的服务器上使用它。但是，正如@Cybrix 建议的那样，您也可以指向 Google 托管的库。请参阅此链接。最后，这可以提高用户的性能。

于 2012-12-17T16:48:25.217 回答