Javascript 数据和 html 传输

标签 javascript php jquery html ajax

在 PHP + jQuery 环境中,我和我的 friend 无法得出最佳解决方案。我们正在使用 Ajax 从数据库中获取数据。

解决方案 1 - Ajax 应该只传输数据,而不是 HTML

好处:我们使用 Ajax 获取 JSON 格式的数据。这样 Ajax 只传输数据,而不传输 HTML。

陷阱:JS 现在需要处理 HTML,因此 JS 将填充 HTML 标记。

解决方案 2 - JS 应该只包含代码,而不是 HTML 标记

好处:我们使用 Ajax 获取 HTML 格式的数据。这种方式 Ajax 传输 HTML,这意味着 JS 可以直接呈现它。 JS 代码中没有 HTML。我还可以使用与 PHP (DRY) 相同的 HTML 模板。

陷阱:Ajax 传输更多数据,因为 HTML 更大。它也不容易操纵。

问题

我们现在有两个案例,我看不出哪个是最好的。也许这是个人喜好?也许出于某种原因,其中一些比另一个更推荐?

这里有更好的解决方案还是个人喜好?如果是这样,为什么那个更好?你会选择哪个?

最佳答案

解决方案 3:在客户端使用 AngularJS 或其他将 JS 与 HTML 分开的框架。仅通过网络发送数据。好处:

  1. 网络上的数据最少,响应时间更短
  2. 服务器可以为具有不同 HTML 要求的多个客户端应用提供服务
  3. 明确分离业务逻辑(服务器端)、 View (HTML 文件)和表示逻辑(JavaScript)

如果除了 JQuery 之外没有其他 JS 框架被允许,那么我会推荐解决方案 1,并且仍然尝试在不同的 JS 函数中将 HTML 构造逻辑与用户交互逻辑分开。

关于Javascript 数据和 html 传输,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33431898/

相关文章:

javascript - 单击按钮时显示工具提示

javascript - 脚本调试不起作用 (VS 2008)

javascript - 如何在不提交表单的情况下获取输入框的值并将计算出的值放入其他输入框?

jquery - 用于 post 和 get 的 Ajax 教程

javascript - 如何在没有 WebPack 构建过程的情况下在 HTML 页面中使用 VueJS .vue 组件?

javascript - 第二次单击后,单选按钮值在 IE 中不正确。在其他浏览器中工作

php - 在php中模糊搜索数组

php - ORDER BY DESC 给出错误的结果

php - Mysql触发返回不良股票值(value)

javascript - 元素离开屏幕