jquery兩種導入方式之本地導入和線上導入
前言
jQuery是一個用來代替JavaScript來快捷書寫前端腳本語言的庫,jQuery可以大大的簡化復雜的js代碼,使開發(fā)人員專注于實現(xiàn)頁面的效果。
導入方式有兩種
jQuery的導入方式有兩種,一種是本地導入,一種是利用超鏈接導入。
方法一:本地導入
- 進入 jQuery 的官方網(wǎng)站:https://jquery.com
- 點擊 Download jQuery
點下圖鏈接
可以看到jquery的源碼,如下:
直接ctrl+A,選中所有的 jQuery 的源碼,在VScode新建一個txt文件,將源碼拷貝到其中,然后修改后綴名為.js即可。
也可以點擊這里快速下載
然后,在要使用jquery的頁面引入這個.js文件,代碼如下:
<script src="你的.js文件路徑"></script>
在這里寫 jquery 代碼
<script> //在此書寫你的jQuery代碼 </script>
注意,一定要先引入 jQuery 源碼,再引入自己寫的 jQuery 代碼,因為頁面的加載順序是從上到下加載,如果瀏覽器會先加載你的 jQuery 代碼再加載 jQuery 庫,造成你的 jQuery 代碼會被認為是錯誤書寫格式,無法實現(xiàn)效果。
方法二:在線上導入有兩種方法
在使用jQuery庫之前,需要先引入它。有兩種方法可以在線引入 jQuery 庫:從官方網(wǎng)站直接下載或從CDN下載。
1. 從官方網(wǎng)站下載:
在下載jQuery庫之前,需要訪問官方網(wǎng)站,并選擇要下載的版本。然后在HTML代碼中添加以下內(nèi)容:
<script src="jquery-3.6.0.min.js"></script>
這將從文件系統(tǒng)中加載 jQuery 庫,并將其添加到HTML頁面中。
2. 從CDN下載:
許多大型互聯(lián)網(wǎng)公司提供了CDN服務,其中包括谷歌,微軟,jQuery和CDNJS等。
這里我們以谷歌CDN為例,在HTML代碼中添加以下內(nèi)容:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
這將從谷歌CDN服務器上下載jQuery庫,并將其添加到HTML頁面中。
補充
- 通過在 script 的 src 屬性中寫一個網(wǎng)址來導入在線的 jQuery 代碼。
- 現(xiàn)在應用 jQuery 的網(wǎng)站非常非常多,可以在其他網(wǎng)站上扒一個 jQuery 代碼鏈接
- 瀏覽器會在加載之前使用jQuery的網(wǎng)站時就預先下載過jquery,因此到了我們這里就不用再次下載了,就算我們的jQuery版本是一個新的沒被瀏覽器加載過的版本,jQuery的代碼下載也會進行的很快
- 但是,如果你還是擔心影響加載速度,本地導入jQuery文件確實是最好的辦法。
- 導入在線 jQuery:
<script src=""></script> <script> //在此書寫你的jQuery代碼 </script>
總結(jié)
到此這篇關于jquery兩種導入方式之本地導入和線上導入的文章就介紹到這了,更多相關jquery本地導入和線上導入內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
JQuery對checkbox操作 (循環(huán)獲?。?/a>
下面是Jquery對checkbox的一些操作,全選,反選,取消全選等等.2011-05-0533個優(yōu)秀的jQuery 教程分享(幻燈片、動畫菜單)
jQuery 是一個非常優(yōu)秀的 JavaScript 框架,使用簡單靈活,在現(xiàn)在的Web開發(fā)項目中扮演著重要角色。這篇文章與大家分享33個優(yōu)秀的 jQuery 教程,教您如何使用 jQuery 制作幻燈片、動畫菜單、照片墻、圖片畫廊等很多效果很炫的功能。2011-07-07Ajax分頁插件Pagination從前臺jQuery到后端java總結(jié)
這篇文章主要從前臺jQuery到后java端總結(jié)了Ajax分頁插件Pagination的使用方法和技巧,感興趣的小伙伴們可以參考一下2016-07-07jQuery實現(xiàn)仿騰訊微博滑出效果報告每日天氣的方法
這篇文章主要介紹了jQuery實現(xiàn)仿騰訊微博滑出效果報告每日天氣的方法,涉及jQuery鼠標事件及css樣式操作技巧,需要的朋友可以參考下2015-05-05