关于js脚本放在一个文件里的疑问？
对于一个小型网站，大多只有几个js文件（1~3），在各个页面引用这些js文件来完成各页面的交互，而不会（或者很少）在某个网页单独的写上js代码。这样，每个页面在dom加载完成后，需要执行的js脚本是怎么样调用的？ 是在某个js文件里中有一个统一的调用接口，在这个接口里，执行所有的js事件绑定，以完成UI交互？ 如果是这样，那么对于某个页面，必然存在绑定很多事件在一些不存在的dom节点上，这就产生了浪费，做了很多无用功。简略代码如下：
<!-- 页面1 -->
<html>
<head> ... </head>
<body>
'''
<div class="test1">...</div>
...
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="test1.js"></script>
<script type="text/javascript" src="test2.js"></script>
</body>
</html>
<!-- 页面2 -->
<html>
<head> ... </head>
<body>
...
<div class="test2">...</div>
...
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="test1.js"></script>
<script type="text/javascript" src="test2.js"></script>
</body>
</html>
// test1.js
$(document).ready(function(){
// 调用各页面封装的接口和执行事件绑定已完成页面交互
$('.test1').click(function(){
// do something
...
});
$('.test2').click(function(){
// do something
...
});
...
});
对于页面1 $('test2')的绑定就是多余的。
对于这种多余是可接受的吗？ 就像对于css一样，把全站的样式放在几个css文件中。
如果不可介绍，是如何避免无效事件绑定（dom节点不存在的情况下）？
对于这种浪费，我现在能想到的是在js文件中编写各个页面的接口，然后在各个页面调用相应接口来避免这样的无效事件绑定，以提高性能（如果可以）。
22336
9 years, 9 months ago
Answers
ls是对的，如果感性上还是不能接受，可以用seajs，这样写页面：
<!-- 页面1 -->
<html>
<head> ... </head>
<body>
'''
<div class="test1">...</div>
...
<script type="text/javascript" src="sea.js"></script>
<script type="text/javascript" src="config.js"></script>
<script>
seajs.use('test1', function () {
$('.test1').click(function(){
// do something
...
});
})
</script>
</body>
</html>
test1做test1的事情，test2的绑定放到test2中去，做好代码的解藕。
昵称又被抢了
answered 9 years, 9 months ago
