javascript - 设计门户容器

Question

我处于必须使用 HTML5 和 Javascript 构建门户容器的场景中。该容器将提供“n”个小部件 URL，并且容器负责通过 Ajax 在 DIV 中(而不是在 iFrame 中)加载它们。

现在的问题是如何将每个小部件的 JavaScript 函数定义分开？比如我在容器页面上有两个DIV，Widget1_DIV和Widget2_DIV。 Widget1 的 HTML、JS 和 CSS 将放在 Widget1_DIV 中，Widget2 也类似。

现在假设这两个小部件都有一个同名的 JS 函数，'foo'，一旦它们嵌入到同一个 DOM 中，这将发生冲突。我想知道 RequireJS 是否有助于避免冲突或使两个小部件的 DIV 模块化的正确解决方案？

谢谢

Answer 1

您是否考虑过使用任何 JS 框架？我向您推荐 AngularJS，因为它的功能、MVC 方法和灵 active 。我知道，这需要在项目生命周期开始时做大量工作，但后来您肯定会观察到优势和稳健的页面结构。

此外，Angular JS 允许您保留分离的项目结构:

- WidgetName
| - javascriptfile.js
| - widgetpage.html
| - javascriptfile_test.js

查看更多:https://angularjs.org/

当然你不需要使用这个特定的框架，还有很多其他很棒的工具:Knockout, Backbone, ...。