这种条件javascript加载方法是否有任何值？

我正在为web应用程序构建一个多页面前端。UI的javascript非常少，但我知道会有大量javascript来处理后端，所以我会尽最大努力使其尽可能稀疏和有限

我想有条件地同步执行javascript，同时只使用一个缩小的js文件。我有一些全局函数，但大多数代码都是特定于页面的。每个页面都有body元素中页面的id。例如，about.html有以下代码

……

我知道加载javascript的各种异步方法，例如

require.js

甚至

$.getScript

，但出于各种原因，我试图避免这种方法。因为我正在预处理HTML，我也不想将每个页面的脚本分解（尽管我可以），因为它是一个小文件，我不想创建一堆不同的

标记。我目前的解决方案是有条件地执行每页所需的javascript，我的做法如下所示：

    $(document).ready(function(){
         //global.js code
        if(document.body.id==='about'){
           // about.js code
        } 
       if(document.body.id==='home'){
           //home.js code
       } 
        // etc.

  });

在构建过程中，所有的js都存储在单独的文件中，因此它在视觉上不像这里看起来那么愚蠢，因为在条件语句的主体中只有一个

include filename.js

---

这些条件可以防止不必要的代码在每个页面上执行。然而，当我这样做的时候，我突然意识到这样做实际上可能没有任何好处。我读到

$（窗口）。load

或

$（“body”）。load

事件可能会导致与

$（文档）冲突。ready

，它们都绝对较慢-就像

窗口一样。onload

（我测试过）。我想这是我比较喜欢的方式。我读到的是真的吗？和/或，我在中所做的是否有用？

对于特定于页面的事件，为什么不在元素引用中添加主体ID

$( '#about .do-something' ).on()...

如果您实际上是在每页执行非基于事件的代码

if( $( '#about' ).length ) { // trigger your code here }

---

它与您的解决方案并没有太大的不同，只是它不要求您保存关于在何处执行代码的清单。无论哪种方式，这两种解决方案都会被缓存。

您所做的相当于在

标记之前添加脚本标记。明白了。因此，您的意思是，这是向html中添加

标记的简写等价物-据我所知，它让我失去了拥有较小脚本文件的好处，但也让我获得了生成较少页面HTTP请求的好处？@user1167442您是否真的在使用和。在这些条件中加载事件？有点像。基本上，您将所有脚本合并到一个巨大的

all.js

文件中，该文件将被加载和缓存。您基本上是在复制

require.js

optimizer功能，除了以一种不是非常模块化的方式…@EasyCo No.我使用预处理，但当页面运行时-它只是特定页面的javascript-无加载事件。这似乎更可取，这很聪明。它本质上和我的一样，但更干净、更简单。谢谢