【发布时间】：2013-09-30 21:55:27
【问题描述】：
始终建议通过将所有代码放在一个包含在所有页面中的JS 文件中来避免内联 Javascript 代码。我想知道，如果这不会导致重页的性能问题。
例如，假设我们有几十个这样的函数
function function1(element){
var el=document.getElementsByClassName(element);
var size=el.length;
if(size==0) return;
for(i=0;i<size;i++){
// the process
}
}
在每一个页面上，我们都需要运行函数来判断HTML中是否有对应的元素。
window.onload = function(){
function1('a');
....
function26('z');
};
但如果将所有函数保存在外部JS文件中，并通过内联JavaScript调用函数，我们只能调用当前页面所需的函数：
<script type="text/javascript">
window.onload = function(){
function6('f');
};
</script>
从性能的角度来看，通过内联 Javascript 调用函数（这当然不是最佳实践）以避免调用很多函数，这不是有益的吗？页面？
当然，这不仅限于函数，因为我们在整个网站上都有很多 addEventListeners，它们会在每个不需要它们的页面上触发。
【问题讨论】：
-
您可以拥有多个具有所有功能的外部 JS 文件，然后是每个页面的特定文件。这将包含通常是内联 JS 的内容
-
没有人说过你的整个网站的每一个功能都需要在一个 Javascript 文件中......为什么你的外部 JS 文件中的代码量与你的“内联”Javascript？
-
@RoryPicko92 一个文件中所有JS代码的一个主要优点是它会被缓存，而不需要通过浏览加载。
-
最重要的是：请检查最近在浏览器中建立“内容安全策略”的尝试......这将使外部 JS 成为强制性
标签： javascript performance dom-events unobtrusive-javascript