jQuery的插件引入顺序问题

今天想用jQuery的fullpage插件做个小demo，却掉进了个大坑，折腾了半天才爬出来，哭唧唧。

现在开始我的掉坑之旅：

1、引用css文件

<link rel="stylesheet" href="css/fullpage.css">

2、引用相关js文件

<script src="js/fullpage.js"></script>
<script src="js/jquery.js"></script>

3、html结构

<div id="fullpage">
    <div class="section">第一屏</div>
    <div class="section">第二屏</div>
    <div class="section">
        <div class="slide">第三屏的第一屏</div>
        <div class="slide">第三屏的第二屏</div>
        <div class="slide">第三屏的第三屏</div>
        <div class="slide">第三屏的第四屏</div>
    </div>
    <div class="section">第四屏</div>
</div>

5、js初始化

$(function($){
        $("#fullpage").fullpage();
    });

好了，完全跟着官方文档走，但在控制台却报出下面的错误：

根据错误一直找问题所在，查代码，找度娘，后来发现我在引入js文件的时候出了错： fullpage 是基于jQuery的插件，当然要先引入jQuery文件啦，

<script src="js/jquery.js"></script>
<script src="js/fullpage.js"></script>

现在问题解决，完全OK

总结 ：

js文件引用要注意引入顺序问题，应当先引入该js文件，再引入基于该文件的插件。