上一篇
下一篇
WML试验
作者:SMbey0nd 日期:2008-09-02
作为一个FE开发者，有必要了解一些WAP的知识。
特接触了一些WML标签的应用，做了个简单的DEMO，试验用。
====================无线的分隔线=====================
程序代码
<?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<head>
<access domain="www.smbey0nd.com"/>
<meta name="keyword" content="WAP"/>
</head>
<card id="Demo1" title="Demo No.1">
<p>
<strong>Hello Wolrd!</strong><br/>
<em>HOHO</em><br/>
This is a <big>Demo</big> For Testing WML in Wap, From <u>SMbey0nd.com.</u><br/>
But, it's without CSS...LOL<br/>
<small>(*^__^*) 嘻嘻……</small><br/>
<img src="/images/Logo1.gif" alt="SMbey0nd's LOGO">
</p>
<anchor>
Go To Demo2
<go href="#Demo2"/>
</anchor>
</card>
<card id="Demo2" title="Demo No.2">
<table columns="3">
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
</tr>
</table>
<anchor>
Back to Demo1
<prev/>
</anchor>
<anchor>
Go to Demo3
<go href="#Demo3"/>
</anchor>
</card>
<card id="Demo3" title="Demo No.3">
<fieldset title="CD Info">
This is an input<input name="Name" size="15"/><br/>
<select>
<option value="wap">This is an option</option>
</select><br/>
<select multiple="true">
<option value="wap">This is an option(M)</option>
</select>
</fieldset>
<anchor>
Back to Demo2
<prev/>
</anchor>
<anchor>
Go to Demo4
<go href="#Demo4"/>
</anchor>
</card>
<card id="Demo4" title="Demo No.4">
<do type="accept" label="Answer">
<go href="#Demo5"/>
</do>
<p>
<select name="name">
<option value="OP1">OP1</option>
<option value="OP2">OP2</option>
<option value="OP3">OP3</option>
</select>
</p>
<anchor>
Go to Demo5(Final Mission)
<go href="#Demo5"/>
</anchor>
</card>
<card id="Demo5" title="Demo No.5 Answer">
<p>
You selected: $(name)^_^ Cool!
The Mission Finished!
花夏小小 爱你！
Bye~ Mario
<a href="http://www.smbey0nd.com/wap.asp">SMbey0nd.com/wap</a>
</p>
</card>
</wml>
DEMO地址：http://www.smbey0nd.com/Demo/wap/Demo1.wml （使用手机浏览）
====================无线的分隔线=====================
WML备忘：
Tips：
1.WML 指无线标记语言(Wireless Markup Language)，用于 WAP 的标记语言。它是一种从 HTML 继承而来的标记语言，但是 WML 基于 XML，因此它较 HTML 更严格。WML 使用标签 - 类似 HTML - 但是语法更严格且遵守 XML 1.0 标准。
2.WML 被用来创建可显示在 WAP 浏览器中的页面。用WML编写的页面被称为 DECKS。DECKS 是作为一套 CARDS 被构造的。
3.WML 使用 WMLScript 在客户端运行简单的代码。WMLScript 是一种轻量级的 JavaScript 语言。不过，WML 脚本并不嵌在 WML 页面中。WML页面仅仅含有对脚本 URL 的引用。WML 脚本在 WAP 浏览器运行之前，需要先在服务器上被编译为字节编码。
4.WML不支持CSS。
5.WML 文档必须含有一个 XML 声明和一个 DTD。
常用标签：
1.Deck / Card 元素：
程序代码
<wml> 用来定义 WML deck (WML 卡片组)。
<card> 用来定义 deck 中的一个 card。card 元素的 "id" 属性可用作锚 (anchor)。
<head> 可包含<access> 和 <meta>的区域。<access>访问控制，<meta>文档元信息。
<template> 为 deck 中的所有 card 定义一个模板：该标签中的“代码（行为）”会添加到 deck 中的每个卡片。
2.文本格式化元素：
程序代码
<b> 粗体
<strong> 强调（效果与<b>一样）
<i> 斜体
<em> 着重（效果与<i>一样）
<big> 大号
<small> 小号
<u> 下划线
3.锚元素：
程序代码
<a> 在任何可能的情况下，使用 <a> 标签代替 <anchor> 标签。
<anchor> 比<a>多出指定的任务<go><prev><refresh>。
4.事件元素：
程序代码
<do> 点击一个单词时激活一个任务，默认是accept类型。如果<card> 包含多个类型为 accept 的 <do> 元素，且这些 <do> 元素没有被命名，WML 会出现编译错误，而且不会显示出页面。
<onevent> 包含了当下列事件发生时所执行的代码：onenterbackward（当 <prev> 跳转到前一个卡片时触发）、onenterforward（当 <go> 跳转到某一个卡片时触发）、onpick（当项目被选取或撤销选取时触发）、ontimer（当计时器终止时触发）。
5.任务元素：
程序代码
<go> 跳转到新卡片的动作，类似<a>。可包含 <postfield> 或 <setvar> 标签。
<noop> 不进行任何动作，防止事件的发生。
<prev> 返回前一个访问过的卡片。
<refresh> 刷新指定的卡片。
6.控件元素：
程序代码
<fieldset> 分组元素。
<input> 文本框。
<select> 可选列表。multiple属性控制单、复选
<option> <select>中的一个选项。
<optgroup> <select>中的一组选项。
还有一些细节上的东西，先不写了，下次补上。
Update 2008-9-5 22:52:20：
补一些要注意的
1.不同的手机品牌、不同的型号，其微浏览器对WML解释都有微小不同。如Nokia的一些新的系列对事件元素（do标签）并没有如期的支持效果，不是像文档中提到的自动触发，而是需要选择“操作”键后才出现候选动作；同时对控件元素的交互也有区别（如单选框，操作时不是直接选中，而是会进入一个特别的选择页面进行选择后再返回原页面）。
2.（云谦同学的提醒）：较新的手机浏览器都支持XML Base（XML简化版），并支持一些简单的CSS和JS，相对于WML能做的更多。轻量级的WML应该快到了更新换代的时候了。
特接触了一些WML标签的应用，做了个简单的DEMO，试验用。
====================无线的分隔线=====================
程序代码<?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<head>
<access domain="www.smbey0nd.com"/>
<meta name="keyword" content="WAP"/>
</head>
<card id="Demo1" title="Demo No.1">
<p>
<strong>Hello Wolrd!</strong><br/>
<em>HOHO</em><br/>
This is a <big>Demo</big> For Testing WML in Wap, From <u>SMbey0nd.com.</u><br/>
But, it's without CSS...LOL<br/>
<small>(*^__^*) 嘻嘻……</small><br/>
<img src="/images/Logo1.gif" alt="SMbey0nd's LOGO">
</p>
<anchor>
Go To Demo2
<go href="#Demo2"/>
</anchor>
</card>
<card id="Demo2" title="Demo No.2">
<table columns="3">
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
</tr>
</table>
<anchor>
Back to Demo1
<prev/>
</anchor>
<anchor>
Go to Demo3
<go href="#Demo3"/>
</anchor>
</card>
<card id="Demo3" title="Demo No.3">
<fieldset title="CD Info">
This is an input<input name="Name" size="15"/><br/>
<select>
<option value="wap">This is an option</option>
</select><br/>
<select multiple="true">
<option value="wap">This is an option(M)</option>
</select>
</fieldset>
<anchor>
Back to Demo2
<prev/>
</anchor>
<anchor>
Go to Demo4
<go href="#Demo4"/>
</anchor>
</card>
<card id="Demo4" title="Demo No.4">
<do type="accept" label="Answer">
<go href="#Demo5"/>
</do>
<p>
<select name="name">
<option value="OP1">OP1</option>
<option value="OP2">OP2</option>
<option value="OP3">OP3</option>
</select>
</p>
<anchor>
Go to Demo5(Final Mission)
<go href="#Demo5"/>
</anchor>
</card>
<card id="Demo5" title="Demo No.5 Answer">
<p>
You selected: $(name)^_^ Cool!
The Mission Finished!
花夏小小 爱你！
Bye~ Mario
<a href="http://www.smbey0nd.com/wap.asp">SMbey0nd.com/wap</a>
</p>
</card>
</wml>
DEMO地址：http://www.smbey0nd.com/Demo/wap/Demo1.wml （使用手机浏览）
====================无线的分隔线=====================
WML备忘：
Tips：
1.WML 指无线标记语言(Wireless Markup Language)，用于 WAP 的标记语言。它是一种从 HTML 继承而来的标记语言，但是 WML 基于 XML，因此它较 HTML 更严格。WML 使用标签 - 类似 HTML - 但是语法更严格且遵守 XML 1.0 标准。
2.WML 被用来创建可显示在 WAP 浏览器中的页面。用WML编写的页面被称为 DECKS。DECKS 是作为一套 CARDS 被构造的。
3.WML 使用 WMLScript 在客户端运行简单的代码。WMLScript 是一种轻量级的 JavaScript 语言。不过，WML 脚本并不嵌在 WML 页面中。WML页面仅仅含有对脚本 URL 的引用。WML 脚本在 WAP 浏览器运行之前，需要先在服务器上被编译为字节编码。
4.WML不支持CSS。
5.WML 文档必须含有一个 XML 声明和一个 DTD。
常用标签：
1.Deck / Card 元素：
程序代码<wml> 用来定义 WML deck (WML 卡片组)。
<card> 用来定义 deck 中的一个 card。card 元素的 "id" 属性可用作锚 (anchor)。
<head> 可包含<access> 和 <meta>的区域。<access>访问控制，<meta>文档元信息。
<template> 为 deck 中的所有 card 定义一个模板：该标签中的“代码（行为）”会添加到 deck 中的每个卡片。
2.文本格式化元素：
程序代码<b> 粗体
<strong> 强调（效果与<b>一样）
<i> 斜体
<em> 着重（效果与<i>一样）
<big> 大号
<small> 小号
<u> 下划线
3.锚元素：
程序代码<a> 在任何可能的情况下，使用 <a> 标签代替 <anchor> 标签。
<anchor> 比<a>多出指定的任务<go><prev><refresh>。
4.事件元素：
程序代码<do> 点击一个单词时激活一个任务，默认是accept类型。如果<card> 包含多个类型为 accept 的 <do> 元素，且这些 <do> 元素没有被命名，WML 会出现编译错误，而且不会显示出页面。
<onevent> 包含了当下列事件发生时所执行的代码：onenterbackward（当 <prev> 跳转到前一个卡片时触发）、onenterforward（当 <go> 跳转到某一个卡片时触发）、onpick（当项目被选取或撤销选取时触发）、ontimer（当计时器终止时触发）。
5.任务元素：
程序代码<go> 跳转到新卡片的动作，类似<a>。可包含 <postfield> 或 <setvar> 标签。
<noop> 不进行任何动作，防止事件的发生。
<prev> 返回前一个访问过的卡片。
<refresh> 刷新指定的卡片。
6.控件元素：
程序代码<fieldset> 分组元素。
<input> 文本框。
<select> 可选列表。multiple属性控制单、复选
<option> <select>中的一个选项。
<optgroup> <select>中的一组选项。
还有一些细节上的东西，先不写了，下次补上。
Update 2008-9-5 22:52:20：
补一些要注意的
1.不同的手机品牌、不同的型号，其微浏览器对WML解释都有微小不同。如Nokia的一些新的系列对事件元素（do标签）并没有如期的支持效果，不是像文档中提到的自动触发，而是需要选择“操作”键后才出现候选动作；同时对控件元素的交互也有区别（如单选框，操作时不是直接选中，而是会进入一个特别的选择页面进行选择后再返回原页面）。
2.（云谦同学的提醒）：较新的手机浏览器都支持XML Base（XML简化版），并支持一些简单的CSS和JS，相对于WML能做的更多。轻量级的WML应该快到了更新换代的时候了。
[本日志由 SMbey0nd 于 2008-09-05 11:01 PM 编辑]
文章来自: 本站原创
引用通告: 查看所有引用 | 我要引用此文章
Tags: WML WAP Front-End 前端开发
文章来自: 本站原创引用通告: 查看所有引用 | 我要引用此文章Tags: WML WAP Front-End 前端开发 评论: 0 | 引用: 0 | 查看次数: -
发表评论