Question

我想为我的网络应用程序使用内容站点保护。如果您还没有听说过，简而言之：它将允许我禁用任何嵌入式JavaScript进入我的网络应用程序，有助于防止XSS。

结果是，我的所有javascript代码都必须在外部文件中。

大多数javascript'库/框架'代码已经存在，但通常我的页面将包含至少几行JS代码，实例化与特定页面相关的组件。

例如，我有一个假设的注册页面。在注册页面的底部，我有以下代码：

var registrationForm = new MyApp.registrationValidator($('.regform'));
registrationForm.init();

此假设代码提供对注册表单的引用，并可以注册所有验证代码。

现在我必须将此代码移动到外部文件。我可以：

选项A ：为每个页面创建一个小的.js文件，只执行特定于该页面的代码。

选项B ：在javascript文件中执行我的所有“实例化代码”。我只会检测页面上是否有“.regForm”css类，并且只有在页面出现时才会实例化我的对象。

选项C：为我的<body>标记提供ID或类，并根据大开关执行正确的代码。

总而言之，选项B是最好的，如果不是因为我觉得拥有大量初始化代码是一个坏主意。

我主要想知道的是，您是否有过这种情况的经历，以及您是如何解决的？

Answer 1

选项D（A和B的变体）：查看将多个javascript源文件编译（和缩小）为一个的部署系统，仅考虑该页面所需的文件。

对于PHP，Assetic就是这样一个系统。

Answer 2

如果你愿意使用像jQuery这样的框架（动态加载和执行外部javascript），你可以将A和B的优点结合起来。每个页面都会加载相同的.js，它确定（通过dom元素的存在或不存在）动态加载哪些其他.js文件。