Javascript 和 jQuery 文件结构

Question

我已经创建了一个相当大的应用程序 javascript 和 jQuery。然而我的文件结构变得有点困惑!

目前，我有一个大型 JS 文件，其顶部有一个 if ($('#myDiv').length > 0) { 测试，仅在正确的页面上执行代码，这是好的做法吗？

同一文件中还混合了纯 JS 函数和 jQuery 扩展，例如 $.fn.myFunction = function(e) {。

我还有一些如下所示的代码:

function Product() {
  this.sku = '';
  this.name = '';
  this.price = '';
}
var myProduct = new Product;

Basket = new Object;

我的问题是关于 javascript 和 jQuery 项目的良好实践的指导。

Answer 1

代码 if ($('#myDiv').length > 0) { 不是一个好的做法。相反，将您的页面特定的 JS 作为函数并在相应的页面中执行它们。像这样:

var T01 = function(){
  // JS specific to Template 01
};
var T02 = function(){
  // JS specific to Template 02
};

模板 01 的 HTML 头部:

<script type="text/javascript"> $(T01); </script>