jQuery Mobile 安裝

在你的網頁中添加 jQuery Mobile

你可以通過以下幾種方式將jQuery Mobile添加到你的網頁中：

  • 從 CDN 中加載 jQuery Mobile (推薦)
  • 從jQuerymobile.com 下載 jQuery Mobile庫

從 CDN 中加載 jQuery Mobile

lamp CDN的全稱是Content Delivery Network，即內容分發網路。其基本思路是盡可能避開互聯網上有可能影響數據傳輸速度和穩定性的瓶頸和環節，使內容傳輸的更快、更穩定。.

使用 jQuery 內核, 你不需要在電腦上安裝任何東西; 你僅僅需要在你的網頁中加載以下層疊樣式 (.css) 和 JavaScript 庫 (.js) 就能夠使用 jQuery Mobile:

jQuery Mobile CDN:

<head>

<!-- meta使用viewport以確保頁面可自由縮放 -->
<meta name="viewport" content="width=device-width, initial-scale=1">

<!-- 引入 jQuery Mobile 樣式 -->
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">

<!-- 引入 jQuery 庫 -->
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>

<!-- 引入 jQuery Mobile 庫 -->
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

</head>

國內用戶推薦使用百度CDN：

jQuery Mobile CDN(百度):

<head>

<!-- meta使用viewport以確保頁面可自由縮放 -->
<meta name="viewport" content="width=device-width, initial-scale=1">

<!-- 引入 jQuery Mobile 樣式 -->
<link rel="stylesheet" href="http://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.css">

<!-- 引入 jQuery 庫 -->
<script src="http://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>

<!-- 引入 jQuery Mobile 庫 -->
<script src="http://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

</head>

本教程引用的庫為百度 CDN 資源庫。


下載 jQuery Mobile

如果你想將 jQuery Mobile 放於你的主機中,你可以從 jQuerymobile.com下載該檔。

<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="jquery.mobile-1.4.5.css">
<script src="jquery.js"></script>
<script src="jquery.mobile-1.4.5.js"></script>
</head>

提示： 將下載的檔放置於與網頁同一目錄下。

lamp 你是否想知道為什麼在 <script> 標籤中 沒有插入 type="text/javascript" ?

在 HTML5 已經不需要該屬性。 JavaScript 在所有現代流覽器中是 HTML5 的默認腳本語言！