设计一个比使用AJAX获取整个HTML文档更好的解决方案

时间:2013-07-10 15:27:43

标签: javascript ajax http

我有一个网页,我正在为个人项目学习javascript和网站开发。该页面包含菜单栏和一些内容。我的想法是,当点击链接时,通过AJAX更改页面内容,这样我:

  1. 从其他页面获取一些新内容
  2. 使用新内容替换旧内容
  3. 使用一些漂亮的javascript视觉效果动画内容更改。
  4. 我认为这比使用标准HTTP GET请求获取整个文档更有效,因为浏览器不必获取文档的<head>标记中提供的样式表和脚本。我还应该补充一点,我只是从我创建的网络应用程序所提供的文档以及我完全了解的内容中提取内容。

    无论如何,我最近遇到了this answer on an SO question,它让我想知道设计符合我为网页提出的要求的解决方案的理想方法。我看待它的方式,有两个解决方案,似乎都不理想:

    1. 配置我从中获取的后端(服务器),如果仅询问内容,它将返回内容而不是整个页面,然后使用AJAX(我当前的解决方案)加载该内容,或
    2. 使用AJAX获取整个文档,然后使用脚本提取内容并将其加载到页面中。
    3. 在我看来,两种解决方案都不是很正确。对于1,似乎我在两个不同的地方分割逻辑:如果要求内容并且javascript必须知道如何询问内容,则必须将服务器配置为提供内容。对于2,似乎这是对AJAX的不恰当使用(根据之前提到的SO答案),因为我要求整个页面然后解析它,当AJAX旨在获取一小部分信息而不是而不是整个文件。

      所以我想问:从工程角度来看,这两种解决方案中哪一种更好?还有另一种解决方案比这两种选择中的任何一种更好吗?

1 个答案:

答案 0 :(得分:1)

  

使用一些漂亮的javascript视觉效果动画内容更改。

请不要。无论如何,你似乎在寻找像Knockout这样的JS MVC框架。

使用这样的框架,您可以让服务器使用各种模板和注释方式返回以JSON或XML表示的模型,这些模型可以将一小部分JS转换为HTML。

因此,不是在浏览器中执行模型到HTML转换服务器并将大量HTML发送到浏览器,而是以浏览器(或者更确切地说JS)理解的方式返回业务对象列表(例如,地址)。让Knockout将其绑定到网格视图,输入元素等。