Javascript 向DOM中注入新代码最有效的方法是什么？

我正在与我的项目的服务器端开发人员（我是前端人员）就向DOM注入新东西进行一场小辩论。他坚持认为，注入大量代码（通过ajax接收）的最佳方法是发送一个JSON对象，然后迭代该对象的每个项。他说这将节省一些带宽，并且对服务器更加友好

显然（对我来说，至少：-），这意味着客户机上有很多cpu周期

数据基本上是一个包含20-30行（每行2-3列）的表，这意味着很少（无用）迭代

另一方面，我认为最好的方法是发送纯XHTML（服务器生成的源代码）并将其注入到位。这意味着只有一个cpu周期（

$（'selector'）。html（数据）

，其中

数据

是通过AJAX接收的数据，但也意味着大量臃肿的html代码

我使用jQuery（但我认为这并不太重要）

大家觉得怎么样？谢谢！

$（'selector'）。html（数据）

不是一个cpu周期，而是一个方法调用。浏览器必须处理所有html

---

唯一的方法是测试这两种方法，并确定您对客户端响应时间与服务器负载的关注程度。从您的描述来看，这两种方法可能都没有多大区别。我怀疑您会想优化第三个因素：开发人员的舒适度。选择最有意义且易于维护的方法。

这取决于对于返回的数据，在我所处的大多数情况下，如果服务器使用表单或一般内容进行回复，我更喜欢像您一样直接使用XHTML

---

但是，如果我需要接收实际的数据，我更喜欢JSON格式。是的，我必须在客户端生成标记，但由于JSON数组中的所有内容都组织得很好，我可以根据需要进行挑选和筛选。这也让我以后可以轻松地更改数据视图，而无需获得back-end guy参与其中（他的待办事项列表总是有4-5天！）

即使起初我通常发送

HTML

插入特定位置，现在我倾向于尽可能地使用

JSON

，

XML

否则，主要是因为我可以修改页面的许多位置，并在几乎没有信息的情况下更动态地进行操作

而且，

JSON

比

XML

占用的空间更小，而且通常更易于“人解析”.XMl的最大优势是它已经存在很长时间了，并且是标准的，因此您手头有工具和知识丰富的工作人员。另一方面，JSON则有点晦涩难懂。当然，任何一个值得付出的开发人员都能够比我写这篇文章更快地学习它。想想看：

• 它具有javascript语法和
• 这与XML的概念相同

关于发送，他说：

如果HTML片段包含表单，或者如果接收的HTML元素是表单，则此方法会在资源管理器中出现可怕的错误

（……）

我将仔细研究JSON，并可能将其转换为我心目中的无限制访问应用程序。尽管如此，我认为XML目前仍然是最好的总体格式，主要是因为人们已经习惯了它

此外，HTML片段可能变得非常复杂（…），因此生成HTML的服务器端脚本可能变得非常复杂

此外，通过只发送HTML，您可以只粘贴信息，您将不会获得信息，您将获得片段，因此无法使用它进行操作。请记住，AJAX的优点是具有动态页面，而不是具有某些部分的页面，这些部分可以在不重新加载整个页面的情况下进行更新。您可以使用它，这是可以的，并且是有效的使用，但你没有充分利用潜力

即使插入HTML可能比

dom

操作更快，我也不认为这有多大（除了IE 6可能存在的问题）。您应该测试一下，在您的使用中，这是否真的是性能的瓶颈

我倾向于同意这篇文章的结束语

虽然我很想说其中一种是“最好的”，但我认为选择正确的格式取决于环境，而不是任何理论思考

---

事实上，是的，这就是我想说的：一个方法调用。如果你与json相比，json引擎迭代整个对象…@Ionut Staicu：是的，但是你仅仅使用HTML就失去了灵活性。而且，在json数据上的循环将通过一个短函数来完成，这应该不会对客户端产生太大影响。仅测试性能就可以了掩盖了一个重要的可维护性问题：JSON使更改演示文稿变得更容易，而无需更改后端API。如果用户体验主要是前端人员的责任，那么使用JSON可能更有意义。