建立

Created: November-22, 2018

當前版本的 JQuery Mobile 是 1.4.5，可以在這裡下載： https ： //jquerymobile.com/

下載 zip 檔案並解壓縮所有檔案。
在應用程式內部（在 www 資料夾中）建立庫（或 lib）資料夾。
在 lib 資料夾中建立一個 jquery-mobile 資料夾（我將其命名為 jqm）。
將你提取的所有 jquery-mobile 檔案放在 jquery-mobile 資料夾中。你現在可以連結到 index.html 檔案中的這些檔案。

在下面的程式碼中，URL 包含 javascript 和 css 檔案。你也可以按照上面的要點進行操作，並按照它在本地計算機上的路徑包含它，即：

<link href="lib/jqm/jquery.mobile-1.4.5.min.css" rel="stylesheet" />
...
<script type="text/javascript" src="lib/jqm/jquery.mobile-1.4.5.min.js"></script>

這些是 css 和 js 檔案的縮小版本。你也可以在開發過程中包含非縮小版本，以便在需要深入瞭解時更容易閱讀。如果你這樣做，我建議在部署到生產時將它們切換回縮小版本。

<!-- it is imported inside head tags. -->

<!-- no additional files needed, if css and js referred with full path. -->

 <!DOCTYPE html>
 <html>
 <head>
 <!-- Viewport setup. -->
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <!-- jQuery Mobile styles come first before js. -->
 <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
 <!-- Basic jQuery library -->
 <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
 <!-- jQuery Mobile library kind of extends upon jQuery -->
 <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
 </head>
 <body>

 <!-- example page element using jQuery mobile tags: -->      
 <div data-role="page" id="pageone">

     <div data-role="header" id="pageone-header">
        <h3>Insert Page header Here</h3>
     </div><!-- /header -->

     <div role="main" class="ui-content" id="pageone-content">
        <center><h3>Page title</h3></center>
        <!-- All HTML for the page content goes here -->
     </div><!-- /content -->
        
    <div data-role="footer" data-position="fixed">
        <h4>Insert Page footer Here</h4>
    </div><!-- /footer -->

 </div>
  
 </body>
 </html>