移动端的HTML5开发基础知识.ppt

目录 HTML5简介 开发移动应用程序的三种方式 HTML5使用上的优势 HTML基础和HTML5新增特性 CSS基础 JavaScript基础 jQuery基础 实例:《移动审批》 jQuery基础 JQuery是一个优秀的Javascript库。它是轻量级的js库 ，它兼容CSS3，还兼容各种浏览器。核心理念是write less, do more(写得更少,做得更多) jQuery语法 Query 语法是为 HTML 元素的选取编制的，可以对元素执行某些操作。 基础语法是：$(selector).action() 美元符号定义 jQuery 选择符（selector）“查询”和“查找” HTML 素 jQuery 的 action() 执行对元素的操作 示例 $(p).hide() //隐藏所有 p 元素 jQuery事件函数 事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。术语由事件“触发”（或“激发”）经常会被使用。 $(button).click(function(){ $(p).hide(); }); 目录 HTML5简介 开发移动应用程序的三种方式 HTML5使用上的优势 HTML基础和HTML5新增特性 CSS基础 JavaScript基础 jQuery基础 实例:《移动审批》 实例：《移动审批》 恒大集团移动审批管理系统，将恒大目前已基于SAP平台实现的业务审批流拓展到移动端。该移动审批系统可支持用户可以不受时间、地点限制进行业务审批，大幅度提高业务流程的审批操作体验和流程推进效率。 《移动审批》框架介绍 客户端是采取开源LightApp框架，这个app内嵌浏览器，通过解释HTML5资源代码来实现具体的页面和功能。 Java后台程序是基本建乔公司产品XMAS来开发。 XMAS: 建乔无线的移动信息化解决方案的统称 《移动审批》资源目录结构 谢谢大家！ 知识回顾Knowledge Review 第 * 页 第 * 页 恒大集团ERP项目文档 第 * 页 恒大集团ERP项目文档 第 * 页 目录 HTML5简介 开发移动应用程序的三种方式 HTML5使用上的优势 HTML基础和HTML5新增特性 CSS基础 JavaScript基础 jQuery基础 实例:《移动审批》 HTML5简介 HTML5是HTML(超文本标记语言)的第五次重大修改. HTML5草案的前身名为 Web Applications 1.0，于2004年被提出，于2007年被W3C接纳，并成立了新的 HTML 工作团队。 HTML 5 的第一份正式草案已于2008年1月22日公布。 2013年5月6日， HTML 5.1正式草案公布。该规范定义了第五次重大版本 HTML5简介 HTML5 仍处于完善之中。然而，大部分移动端系统和现代浏览器都已经支持HTML5 。 移动端系统（如安卓，IOS, WP等）都能支持HTML5 。 支持HTML5的浏览器包括: Firefox（火狐浏览器），IE9及其更高版本，Chrome（谷歌浏览器），Safari，Opera等； 国内的遨游浏览器（Maxthon），以及基于IE或Chromium（Chrome的工程版或称实验版）所推出的360浏览器、搜狗浏览器、QQ浏览器、猎豹浏览器等国产浏览器。 目录 HTML5简介 开发移动应用程序的三种方式 HTML5使用上的优势 HTML基础和HTML5新增特性 CSS基础 JavaScript基础 jQuery基础 实例:《移动审批》 开发移动应用程序的三种方式：原生、HTML5或混合 原生应用程序：原生应用程序是某一个移动平台（比如iOS或安卓）所特有的，使用相应平台支持的开发工具和语言（比如iOS平台支持Xcode和Objective-C，安卓平台支持Eclipse和Java）。原生应用程序看起来（外观）和运行起来（性能）是最佳的。 典型的项目例子： 《移动验收》， 《移动形象进度》等 《移动验收》主页面 开发移动应用程序的三种方式：原生、HTML5或混合 HTML5应用程序：HTML5应用程序使用标准的Web技术，通常是HTML5、JavaScript和CSS。这种只编写一次、可到处运行的移动开发方法构建的跨平台移动应用程序可以在多个设备上运行。开发人员使用HTML5和JavaScript能构建功能复杂的应用程序。 典型的项目例子： 《围住神经猫》等社交小游戏 《围住神经猫》社交小游戏 开发移动应用程序的三种方式：原生、HTML5或混合 混合应用程序：混合应用程序让开发人员可以把HTML5应用程序嵌入到一个原生容器里面，集原生应用程序和HTML5应用程序的优点（及缺点）于一体。 典型