对js文件编译执行顺序的认识_utils里面的js文件为什么比mainjs还先执行-优快云博客

本文详细解析了一个在JS脚本中使用日期控件时遇到的“ReferenceError: J is not defined”的错误原因，并提供了正确的引入顺序解决方案。通过实例演示了如何避免此类错误，确保脚本的顺利执行。

写完了一段js脚本，其中在/js/client/updateLogPage.js里面有对lhgcalendar.Js的引用，确认了这个日期控件所依赖的两个js文件

<script type="text/javascript" src="/js/lhgcore/lhgcore.min.js"></script>
<script type="text/javascript" src="/js/lhgcore/lhgcalendar.min.js"></script>

都在之后，很纳闷为何要报“ReferenceError: J is not defined”这个错误。

原来我还没有走出C++和java等高级语言的编译执行流程的思维定势。原来js文件是逐个文件加载并执行的，前面引入的文件并不管后面引入的文件。我的引入顺序是这样的：

<head>
	<script type="text/javascript" src="/js/jquery-1.7.2.min.js"></script>
	<script type="text/javascript" src="/js/client/updateLogPage.js"></script>
	<script type="text/javascript" src="/js/lhgcore/lhgcore.min.js"></script>
	<script type="text/javascript" src="/js/lhgcore/lhgcalendar.min.js"></script>
	<script type="text/javascript" src="/js/highcharts.js"></script>
</head>

我是在第二个文件里使用了第三个文件的方法：

J(function(){   
    J('#startDate').calendar({ maxDate:'%y-%M-%d',minDate:'2011-01-01',btnBar:false });
});     
J(function(){
    J('#endDate').calendar({ minDate:'#startTime',maxDate:'%y-%M-%d',btnBar:false  });
});

程序加载了第二个文件后就开始执行这段脚本，J这个方法所在的js文件这个时候还没有加载进来，所以报错。学js就得用js的规则了。

另外，用这个lhg这个控件的时候，lhgcore必须在lhgcalendar之前引入。不然调用calendar方法会出错。