Javascript 处理许多DOM更改

我有一个项目，通过ajax请求加载部分内容。每次我都会得到相同的json信息结构，我试图为每个呈现这些结构的DOM布局创建一个coffeescript类

我正在处理这些结构的第一个DOM表示，我的代码被诸如controls.append@Legende.content.messageSpan或@Legende.content.autostm.append$labelNew.html Name之类的语句破坏了：

问题是：我必须实现以下3种DOM表示，这将破坏我的代码

---

我的问题如下：处理许多DOM树更改和/或防止扩大文件数量和增加文件大小的主要做法是什么

如果您确实有大量基于底层模型中的更改的DOM更改，那么最好使用一个库，该库允许您隐式地将DOM绑定到模型，而不需要显式更改。这方面最受欢迎的两个库是

除了这个什么都不做 这是你可能需要的，也可能不需要的 一般来说，KnockoutJS更简单、更容易接近

Angular有点复杂和固执己见，但规模和项目都会变大

这些库通过向html添加注释来工作，就像这个基于淘汰的示例一样

<tr>
    <td><input data-bind="value: name" /></td>
    <td><select data-bind="options: $root.availableMeals, value: meal"></select></td>
    <td data-bind="text: formattedPrice"></td>
    <td><a href="#" data-bind="click: $root.removeSeat">Remove</a></td>
</tr>   

---

您可以随意设置dom，它会自动更改以反映绑定到它的数据。

如果您不使用任何模板引擎，你必须一步一步地操作你的DOM。我想我使用类作为模板，在我的构造函数中，父DOM元素作为参数，它引用一个节点，在那里附加我的所有元素。但是这些是巨大的类和方法，也是绑定DOM和models@IvanAntropov当然你可以一整天都在列出这些。你有angularjs带来更多东西的例子吗？@felix看看链接就知道了。他们在介绍页上列出了所有这些。简而言之：路由、易于测试、Ajax的助手功能、可重用的GUI组件、鼓励干编码的结构和无全局范围变量