jQuery Mobile学习日记之HelloWorld

时间 2019-11-20

标签 jquery mobile 学习日记 helloworld 栏目 JQuery 繁體版

原文原文链接

这里是本人学习jQuery Mobile的过程，主要用于记录，过程当中有不对的地方或不严谨的地方，欢予以指出纠正，很是感谢！javascript

一、首先是下载安装如下文件：css

【Opera Mobile Emulator】 http://www.opera.com/zh-cn/developer/mobile-emulator。在PC机上模拟移动设备，但素后来发现Myeclipse2014貌似有带模拟器。html

【Myeclipse2014】 http://pan.baidu.com/s/1gd4PE3D 密码：lv3v java

如下我是下载了，扔到一个文件夹就没管了-_-不知道有木有影响= =jquery

【jQuery核心库】 http://jquery.com/download/canvas

【jQuery Mobile】 http://jquerymobile.com/eclipse

下载地址：http: //jquerymobile.com/resources/download/jquery.mobile-1.3.2.zip 学习

二、根据百度：http://jingyan.baidu.com/article/f0e83a25b2d7da22e5910107.htmlspa

三、点开，修改一下要显示的字：code

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="utf-8"/>
 5     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
 6     <meta name="description" content="A single-page template generated by MyEclipse Mobile Tools"/>
 7 
 8     <title>喆喆</title>
 9 
10     <link rel="stylesheet" href="./css/jquery.mobile-1.3.0.css"/>
11         
12     <script type="text/javascript" src="./js/jquery-1.8.3.js"></script>
13     <script type="text/javascript" src="./js/jquery.mobile-1.3.0.js"></script>
14     <script type="text/javascript" src="rte/cordova.js"></script>
15     <script type="text/javascript" src="rte/rte.js"></script>
16     <script type="text/javascript" src="js/main.js"></script>
17     
18     <link rel="stylesheet" href="css/style.css" />
19 </head>
20 
21 <body>
22     <div data-role="page">
23         <div data-role="header" >
24             <h1>喆喆君主页~</h1>
25         </div><!-- /header -->
26 
27         <div data-role="content" >
28             <p>HolleWorld！</p>
29                 <canvas width="" height="300"></canvas>
30         </div><!-- /content -->
31 
32         <div data-role="footer" data-position="fixed" >
33             <h4>@sucia</h4>
34         </div><!-- /footer -->
35     </div><!-- /page -->
36 </body>
37 </html>

四、运行（不知道为啥个人选安卓出不来，选苹果才能够，以后切换安卓又行...）

五、模拟器效果