JavaScript開發者都知道，如果要在網站上使用許多第三方庫和框架，最好的方式是使用CDN（內容分發網絡）。CDN提供了從全球各地的服務器上快速下載庫和框架的能力，從而可以加速網站加載時間。在本文中，我們將探討如何使用JavaScript下載CDN庫。
假設我們想使用jQuery庫。在頁面的<head>標簽中，我們可以添加以下代碼，以從CDN獲取jQuery庫：
<head>
<script src="https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js"></script>
</head>在這個例子中，<script> 標簽的 "src" 屬性是CDN所在位置的URL。將這個URL放在<script>標簽中，瀏覽器便會下載jQuery庫并在頁面中使用。
不同的CDN服務提供商有不同的URL格式，這是需要我們關注的。以下是幾個常見的CDN URL格式：
- jsdelivr:https://cdn.jsdelivr.net/npm/[packageName]@[version]/[file]
- unpkg:https://unpkg.com/[packageName]@[version]/[file]
- cdnjs:https://cdnjs.cloudflare.com/ajax/libs/[packageName]/[version]/[file]
在這些URL中，[packageName]是需要下載的庫或框架名稱，[version]是需要下載的版本號，[file]是需要下載的文件名。例如，在前面的jQuery CDN URL中，[packageName]為"jquery"，[version]為"3.6.0"，[file]為"jquery.min.js"。
你可以輕松地從CDN獲取和加入其他庫和框架。例如，假設你需要導入Bootstrap庫。
<head>
<link rel="stylesheet" integrity="sha384-UFl0ub/0qChS2ev/v47U/Y6Dw9d2jNeW6H7gZ7SzGn1or70x0VMAlfQkn+L/sxKu" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/js/bootstrap.min.js" integrity="sha384-S4pvysmtkCs/3Gsf2fcPXSr+WJf0laWoZ7S1C//mL9zqP7xRZfAxgfJpsRbavP3l" crossorigin="anonymous"></script>
</head>以上示例中，下表顯示了我們從CDN獲取Bootstrap庫的不同部分。
| 部分 | URL |
| CSS | https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min.css |
| JavaScript | https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/js/bootstrap.min.js |
一些CDN服務還允許您在鏈接中指定第三方庫和框架的特定版本號。這意味著您可以控制您的網站使用哪個版本的庫或框架。
在本文中，我們介紹了使用JavaScript從CDN獲取和下載庫和框架的過程，以加快網站加載速度。無論您是否采用了這個流程，CDN都是許多JavaScript開發者的首選方法之一，以提供快速下載庫和框架的能力。嘗試使用CDN獲取一些庫和框架，看看是否能讓您的網站更快。
上一篇php gmp()