WML 编程技术

IC-MSP<2.0>

课程目标

掌握 WML 标签的使用

掌握使用 WML 语言开发 WAP 网站

IC-MSP<2.0>

理解 WML 语言

WML（ Wireless Markup Language - 无线标

记语言），与 HTML类似，主要包括元素和标

签。 HTML写出的内容我们可以在 PC机上用

IE 等浏览器进行查看，而 WML语言写出的文

件则是专门用来在手机等一些无线终端显示屏

上显示，供人们阅读的，并且同样也可以向使

用者提供人机交互界面，接受使用者输入的查

询等信息，然后向使用者返回他所想要获得的

最终信息。

IC-MSP<2.0>

理解 WML 语言

• WML（ Wireless Markup Language - 无线标记语言），内置于移动设备中的微型浏览器能够解释这种标记语言。它是 XML的一个应用子集，基于 WAP（ Wireless Application Protocol无线应用协议，向移动终端提供互联网内容和服务的全球统一的开放式协议标准）

• 与 HTML类似，主要包括元素和标签。 HTML写出的内容我们可以在 PC机上用 IE等浏览器进行查看

，而 WML语言写出的文件则是专门用来在手机等一些无线终端显示屏上显示，供人们阅读的，并且同样也可以向使用者提供人机交互界面，接受使用者输入的查询等信息，然后向使用者返回他所想要获得的最终信息。

IC-MSP<2.0>

WML 手机应用实例一

3G 首页

注册 与登陆：

IC-MSP<2.0>

WML 手机应用实例二

IC-MSP<2.0>

WML 程序结构

WML 元素和标签

元素是符合 DTD( 文档类型定义 )的文档组成部分标签规定元素的属性及元素在文档中的位置单独标签 /成对标签

<card> 内容 </card> <br/> <?xml version="1.0" encoding="gb2312"> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"><wml><card id="card1" title="标题 "><p>Hello,World!<br/>Hello,WML!</p><!–- 此处为注释不显示 --></card></wml>

使用手机模拟器测试WML程序

IC-MSP<2.0>

WML 程序结构形式及组成

❏语法 ❏文件声明 ❏标签 ❏元素 ❏属性 ❏注释

❏文档结构

<?xml version="1.0" encoding="gb2312"> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"><wml><card id="card1" title="标题 "><p>Hello,World!<br/>Hello,WML!</p><!–- 此处为注释不显示 --></card></wml>

WML 程序结构

IC-MSP<2.0>

WML 字符使用基本规则大小写敏感 空格 标签及属性 不显示的内容 保留字符显示汉字

WML 语言基本知识

IC-MSP<2.0>

卡片与卡片组Card 与 Deck

CardCardCardCard

CardCardCardCard

Deck

WML 语言基本知识

IC-MSP<2.0>

<?xml version="1.0" encoding="gb2312"> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"><wml><card id="one" title=“ 第一个卡片 ">Hello,World!</card><card id="two" title=“ 第二个卡片 ">Hello,WML!</card></wml>

WML 编程

卡片、卡片组及其元素card 元素

IC-MSP<2.0>

<?xml version="1.0" encoding="gb2312"?><!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.3//EN"

"http://www.wapforum.org/DTD/wml13.dtd"><wml><card id="card1" title="3G 首页 ">用户名称 :<input type="text" name="userName" size="6" format="6a"/

><br/>用户密码 :<input type="password" name="userPass" size="6"

format="5A"/></card></wml>

WML 编程用户输入处理元素input 元素

IC-MSP<2.0>

<?xml version="1.0" encoding="gb2312"?><!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.3//EN"

"http://www.wapforum.org/DTD/wml13.dtd"><wml><card id="card1" title=" 在线报名 ">真实姓名 :<input type="text" name="userName" size="6" maxlength="6"/><br/>性别 :<select name="sex">

<option value=" 男 "> 男 </option><option value=" 女 "> 女 </option>

</select>学历 :<select name="education" value="5" multiple="false"> <optgroup>

<option value="08071A"> 中专 </option> <option value="08071A"> 高中 </option> <option value="08021A"> 大专 </option> <option value="08051A"> 本科 </option> <option value="08061A"> 硕士或更高 </option>

</optgroup></select></card></wml>

WML 编程用户输入处理元素select 、 option 、 optgroup元素

IC-MSP<2.0>

<?xml version="1.0" encoding="gb2312"?><!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.3//EN"

"http://www.wapforum.org/DTD/wml13.dtd"><wml><card id="one" title="one"><anchor> 链接到卡片 two<go href="#two"/></anchor><br/><a href="#two"> 通过 a 标记链接到卡片 two</a></card>

<card id="two" title="two">two</card></wml>

WML 编程锚点、图像、定时器及其元素anchor 、 a 元素

IC-MSP<2.0>

<?xml version="1.0" encoding="gb2312"?><!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML

1.3//EN" "http://www.wapforum.org/DTD/wml13.dtd"><wml><card id="one" title=" 图片显示 ">图片一 :<img src="qq.bmp" alt=" 提示 "/><br/>图片二 :<img src="ss.bmp" alt=" 提示 " width="50"

height="50"/></card></wml>

WML 编程锚点、图像、定时器及其元素img 元素

IC-MSP<2.0>

<?xml version="1.0" encoding="gb2312"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML

1.3//EN" "http://www.wapforum.org/DTD/wml13.dtd"> <wml> <card id="splash" title=" 定时器 " ontimer="input.wml"> <timer name="timer1" value="100"/> <p align="center"> 开始显示 ..... <img src="ss.bmp" alt=" 提示 "/> </p> </card> </wml>

WML 编程锚点、图像、定时器及其元素timer 元素

IC-MSP<2.0>

<?xml version="1.0" encoding="gb2312"> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"><wml><card id="three" title=" 段落 "> <p>welcome to the IMTI!</p> <p align="center">welcome to <br/>the IMTI!</p> <p mode="nowrap">Welcome to the IMTI!</p> <p>aaaaaaaaaaaa<p>bbbbbbbbbbbbbbbbbbbbbbbbbb</card></wml>

WML 编程文本格式化及其元素br 、 p 元素

IC-MSP<2.0>

<?xml version="1.0" encoding="gb2312"> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml"><wml> <card id="style" title=" 字符标记的使用 "> <p> 正常显示 <br/> <b> 粗体显示 </b><br/> <big>Big 字体 </big> <em>Emphasis 强调 </em> <br/> <i>Italics 斜体 </i><br/> <small>Small 字体 </small><br/> <strong>Strong 字体 </strong><br/> <u>Underlined 下划线 </u><br/> <b><small>Bolded Small 混合使用 </small></b> </p> </card> </wml>

WML 编程文本格式化及其元素b 、 big 、 em 、 i 、 small 、 strong 、u 、元素

IC-MSP<2.0>

<?xml version="1.0" encoding="gb2312"?><!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.3//EN"

"http://www.wapforum.org/DTD/wml13.dtd"><wml><card id="table" title=" 表格使用 "> <p> <table columns="2" border="1"> <tr> <td> 姓名 </td>

<td> 性别 </td> <td> 电话号码 </td> </tr> <tr> <td> 张三 </td>

<td> 男 </td> <td>15866668888</td> </tr>

<tr> <td> 李四 </td>

<td> 女 </td> <td>15988889999</td> </tr> </table> </p> </card></wml>

WML 编程

table 元素

IC-MSP<2.0>

JSP 简介

JSP(Java Server Pages)是由 Sun Microsystems公司倡导、许多公司参与一起建立的一种动态网页技术

标准。 JSP技术是用 JAVA语言作为脚本语言的， JSP网页为整个服务器端的 JAVA库单元提供了一个接口来服务于 HTTP 的应用程序。

在 HTML或 WML文件 (*.htm,*.wml)中加入 Java程序片段 (Scriptlet)和 JSP标记 (tag)，就构成了 JSP网页 (*.jsp)。 Web服务器在遇到访问 JSP网页的请求时，首先执行其中的程序片段，然后将执行结果以HTML或 WML格式返回给客户。程序片段可以操作数

据库、重新定向网页以及发送 email 等等，这就是建立动态网站所需要的功能。。

IC-MSP<2.0>

JSP 优点

对于用户界面的更新，其实就是由 Web Server进行 的，所以给人的感觉更新很快。

所有的应用都是基于服务器的，所以它们可以时刻保 持最新版本。

客户端的接口不是很繁琐，对于各种应用易于部署、维护和修改。

IC-MSP<2.0>

<?xml version="1.0" encoding="gb2312"> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"

"http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card id="card1" title=" 用户登陆 "> 用户名称 :<input type="text" name="userName" size="6" maxlength="6"/><br/> 用户密码 :<input type="password" name="userPass" size="6" maxlength="6"/> <anchor> 登陆 <go href="login.jsp"> <postfield name="uname" value="$(userName)"/> <postfield name="upass" value="$(userPass)"/> </go> </anchor> </card> </wml>

WML 运用

编写 login.wml, 用于登陆，输入用户名和密码，点登陆进入到 login.jsp

IC-MSP<2.0>

<%@ page contentType="text/html;charset=GB2312"%><?xml version="1.0" encoding="gb2312"?><!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.3//EN"

"http://www.wapforum.org/DTD/wml13.dtd"><wml><card id="card1" title=" 用户登陆 "><%!String name;String pass;%><%name=request.getParameter("uname");pass=request.getParameter("upass");%>欢迎您，您的用户名是 :<font color="red"><%=name%></font>, 密码是 <font

color="red"><%=pass%></font></card></wml>

WML 和 JSP 运用编写 login.jsp, 用于获取用户输入的用户名和密码

IC-MSP<2.0>

掌握 WML 编程语言的基本用法

能够使用 wml 语言进行编程

总结

IC-MSP<2.0>

< 谢谢 !

结束