Decide on Host or link to the jQuery framework files

Hosting The Files With Your Webapp

Download the following:

The jQuery Mobile package from http://jquerymobile.com/download/

Get the latest ZIP package.

The jQuery core from http://jquery.com

The production version is recommended.

Inside the package there are two types of JavaScript / CSS files: one with the min suffix and one without. The files with the min suffix are the recommended version for production because they are minified (compressed, without spaces, comments and line-breaks). If you need to debug inside jQuery Mobile, you can use the non-suffixed versions.

Typically you will add the following files to your project’s root folder:

jquery-XX.js (from the jQuery core)
images folder
jquery.mobile-XX_min.js
jquery.mobile-XX_min.css

Files with the structure name are also useful if we are going to create your own theme.

Using A Content Delivery Network (CDN)

The obvious restriction with this approach is that the webapp will work only if the public CDN is online.

Note that if you are creating hybrid or native apps (e.g. PhoneGap apps) you should not use a CDN as if the device has no connection you can't even show a nice alert using the framework. If you are creating HTML5 offline webapps you can use the CDN if you add them to the application manifest.

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js" > </script>
<script src="http://code.jquery.com/mobile/ 1.0/jquery.mobile-1.0.min.js" > </script>

If you are providing our own theme you would use the following

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile.structure-1.0.min.css" />
<-- Your theme CSS file here -->
<script src="http://code.jquery.com/jquery-1.6.4.min.js" > </script>
<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js" > </script>

To always use the latest builds

This option is only normally used for development and testing purposes (you may get unstable development code!).

<link href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css" rel="stylesheet" type = "text/ css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js" > </script >
<script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js" > </script >