从多个javascript文件加载多个函数

时间:2017-03-25 22:41:26

标签: javascript html function onload

我在多个外部JavaScript文件中有多个函数,我想在页面加载时加载它们。如果我使用" body onLoad"然后一个功能总是取代另一个。如何配置它以便我可以从每个文件加载每个函数并在页面上加载它们?

我尝试通过将两个函数(目前只有2个)放入一个javascript文件来组合文件,但每当我使用" document.getElementById(" clockModule")时,innerHTML =& #34;为了将数据输出到特定的div ID,数据输出到单个ID并且它们彼此重叠

2 个答案:

答案 0 :(得分:2)

执行window.onload = function(){ ... }时,您正在做的是为window.onload分配一个新值,替换之前分配给它的任何内容。这意味着只能有一个值。以同样的方式,innerHTML替换了元素的全部内容。

相反,请使用addEventListener附加您的事件处理程序,并考虑创建DOM节点并使用createElementappendChild附加它们。

答案 1 :(得分:0)

在开发期间,可以加载几个单独的.js文件。但是,一旦您准备好发布到生产环境,您就会将所有.js推送到一个文件中以达到性能目的(甚至可能minify)。在任何情况下,我总是使用DOMContentLoaded监听器,如:

document.addEventListener('DOMContentLoaded', function() {
  //do stuff in here.
  if(window.location.pathname === '/about'){
    //do page specific stuff in here.
  }
}, false);