WAP Learn1

原创 2006年06月09日 10:00:00

The WAP protocol was designed to show internet contents on wireless clients, like mobile phones.


What you should already know

Before you continue you should have a basic understanding of the following:

  • WWW, HTML and the basics of building Web pages
  • JavaScript
  • XML

If you want to study these subjects first, before you start reading about WAP and the wireless markup language WML, you can find the tutorials you need at W3Schools' Home Page.


What is WAP?

The wireless industry came up with the idea of WAP. The point of this standard was to show internet contents on wireless clients, like mobile phones. 

  • WAP stands for Wireless Application Protocol
  • WAP is an application communication protocol
  • WAP is used to access services and information
  • WAP is inherited from Internet standards
  • WAP is for handheld devices such as mobile phones
  • WAP is a protocol designed for micro browsers
  • WAP enables the creating of web applications for mobile devices.
  • WAP uses the mark-up language WML (not HTML)
  • WML is defined as an XML 1.0 application

The Wireless Application Protocol

The WAP protocol is the leading standard for information services on wireless terminals like digital mobile phones.

The WAP standard is based on Internet standards (HTML, XML and TCP/IP). It consists of a WML language specification, a WMLScript specification, and a Wireless Telephony Application Interface (WTAI) specification.

WAP is published by the WAP Forum, founded in 1997 by Ericsson, Motorola, Nokia, and Unwired Planet. Forum members now represent over 90% of the global handset market, as well as leading infrastructure providers, software developers and other organizations. You can read more about the WAP forum at our WAP Forum page.


WAP Micro Browsers

To fit into a small wireless terminal, WAP uses a Micro Browser.

A Micro Browser is a small piece of software that makes minimal demands on hardware, memory and CPU. It can display information written in a restricted mark-up language called WML.

The Micro Browser can also interpret a reduced version of JavaScript called WMLScript.


What is WML?

WML stands for Wireless Markup Language. It is a mark-up language inherited from HTML, but WML is based on XML, so it is much stricter than HTML.

WML is used to create pages that can be displayed in a WAP browser. Pages in WML are called DECKS. Decks are constructed as a set of CARDS.


What is WMLScript?

WML uses WMLScript to run simple code on the client. WMLScript is a light JavaScript language. However, WML scripts are not embedded in the WML pages. WML pages only contains references to script URLs. WML scripts need to be compiled into byte code on a server before they can run in a WAP browser.

Visit our WMLScript tutorial to learn more about scripting in WML documents.


Examples of WAP use

  • Checking train table information
  • Ticket purchase
  • Flight check in
  • Viewing traffic information
  • Checking weather conditions
  • Looking up stock values
  • Looking up phone numbers
  • Looking up addresses
  • Looking up sport results

FAQ about WAP

These are frequently asked question about WAP:

  • What is WAP?
  • Who is WAP for?
  • How does WAP relate to standardization bodies?
  • How is WAP related to Internet standards?
  • What is the status of WAP?
  • What is the future of WAP?

We will try to answer most of these questions. In the meantime read the answers at: http://www.wapforum.org/faqs/index.htm.

WAP Homepages

WAP homepages are not very different from HTML homepages. The markup language used for WAP is WML (Wireless Markup Language). WML uses tags - just like HTML - but the syntax is stricter and conforms to the XML 1.0 standard.

WML pages have the extension *.WML, just like HTML pages have the extension *.HTML.


WML Tags

WML is mostly about text. Tags that would slow down the communication with handheld devices are not a part of the WML standard. The use of tables and images is strongly restricted. 

Since WML is an XML application, all tags are case sensitive (<wml> is not the same as <WML>), and all tags must be properly closed.


WML Decks and Cards

WML pages are called DECKS. They are constructed as a set of CARDS, related to each other with links. When a WML page is accessed from a mobile phone, all the cards in the page are downloaded from the WAP server. Navigation between the cards is done by the phone computer - inside the phone - without any extra access trips to the server.


Example WML document:

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>

<card id="HTML" title="HTML Tutorial">
<p>
Our HTML Tutorial is an award winning 
tutorial from W3Schools.
</p>
</card>

<card id="XML" title="XML Tutorial">
<p>
Our XML Tutorial is an award winning 
tutorial from W3Schools.
</p>
</card>

</wml>

As you can see from the example, the WML document is an XML document. The DOCTYPE is defined to be wml, and the DTD is accessed at www.wapforum.org/DTD/wml_1.1.xml.

The document content is inside the <wml>...</wml> tags. Each card in the document is inside <card>...</card> tags, and actual paragraphs are inside <p>...</p> tags. Each card element has an id and a title.

Decks and Cards

WML pages are often called "decks". A deck contains a set of cards. A card element can contain text, markup, links, input-fields, tasks, images and more. Cards can be related to each other with links. 

When a WML page is accessed from a mobile phone, all the cards in the page are downloaded from the WAP server. Navigation between the cards is done by the phone computer - inside the phone - without any extra access trips to the server:

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>

<card id="no1" title="Card 1"> 
<p>Hello World!</p>
</card>

<card id="no2" title="Card 2"> 
<p>Welcome to our WAP Tutorial!</p>
</card>
</wml>

The result MIGHT look like this in your mobile phone display (note that only one card is displayed at a time):

 ------ Card 1 ------

 Hello World!








Paragraphs and Line Breaks

A WML card can be set up to display the paragraph and line break functions of WML:

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>
<card title="Paragraphs"> 
<p>
This is a paragraph
</p>
<p>
This is another<br/>with a line break
</p>
</card>
</wml>

The result MIGHT look like this in your mobile phone display:

 ------ Paragraphs ------

 This is a paragraph

 This is another
 with a line break





Text Formatting

A WML card can be set up to display the text formatting functions of WML:

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>
<card title="Formatting"> 

<p>
normal<br/>
<em>emphasized</em><br/>
<strong>strong</strong><br/>
<b>bold</b><br/>
<i>italic</i><br/>
<u>underline</u><br/>
<big>big</big><br/>
<small>small</small>
</p>

</card>
</wml>

The result MIGHT look like this in your mobile phone display (don't take it for granted that all formatting tags will render as expected):

----- Formatting -----

normal
emphasized
strong
bold
italic
underline
big
small


Tables

A WML card can be set up to display the table functions of WML:

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>
<card title="Table">
<p>
<table columns="3">
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
</tr>
</table>
</p>
</card>
</wml>

The result MIGHT look like this in your mobile phone display:

 ------ Table ------

Cell 1   Cell 2   Cell 3






Links

A WML card can be set up to display the anchor functions of WML.

<anchor>

The <anchor> tag always has a task ("go", "prev", or "refresh") specified. The task defines what to do when the user selects the link. In this example, when the user selects the "Next page" link, the task says "go to the file test.wml":

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>
<card title="Anchor Tag">
<p>
<anchor>Next page
<go href="test.wml"/> 
</anchor>
</p>
</card>
</wml>

<a>

The <a> tag always performs a "go" task, with no variables. The example below does the same as the <anchor> tag example:

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>
<card title="A Tag">
<p>
<a href="test.wml">Next page</a>
</p>
</card>
</wml>


Image

A WML card can be set up to display an image:

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>
<card title="Image"> 
<p>
This is an image
<img src="/images/stickman.wbmp" alt="stickman" />
in a paragraph
</p>
</card>
</wml>

The result MIGHT look like this in your mobile phone display:

 ------ Image ------

 

This is an image stickman  in a paragraph

Note that .wbmp is the only image type that can be displayed in a WAP browser.

Input Fields

A WML card can be set up to let a user enter information, as demonstrated in this example:

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>
<card title="Input">

<p> 
Name: <input name="Name" size="15"/><br/> 
Age:  <input name="Age" size="15" format="*N"/><br/>
Sex:  <input name="Sex" size="15"/>
</p>

</card> 
</wml>

The result MIGHT look like this in your mobile phone display:

----- Input ----------

 Name: 
 Age : 
 Sex : 


Select and Option

A WML card, can be set up to display the select and option functions of WML:

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>
<card title="Selectable List 1"> 

<p>
<select>
<option value="htm">HTML Tutorial</option>
<option value="xml">XML Tutorial</option>
<option value="wap">WAP Tutorial</option>
</select>
</p>

</card>
</wml>

The result MIGHT look like this in your mobile phone display:

--- Selectable List 1---

  HTML Tutorial
  XML Tutorial
  WAP Tutorial


In the example below, the result is a selectable list where the user can select more than one item:

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>
<card title="Selectable List 2"> 

<p>
<select multiple="true">
<option value="htm">HTML Tutorial</option>
<option value="xml">XML Tutorial</option>
<option value="wap">WAP Tutorial</option>
</select>
</p>

</card>
</wml>

The result MIGHT look like this in your mobile phone display:

--- Selectable List 2---

  HTML Tutorial
  XML Tutorial
  WAP Tutorial




Fieldset

A WML card, can be set up to display the fieldset function of WML:

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>
<card title="Fieldset"> 

<p>
<fieldset title="CD Info">
Title: <input name="title" type="text"/><br/>
Prize: <input name="prize" type="text"/>
</fieldset>
</p>

</card>
</wml>

The result MIGHT look like this in your mobile phone display:

------- Fieldset--------

CD Info Title: 
 Prize:

 

A task specifies what action to perform when an event, like entering a card or selecting a link, occurs.


Go Task

The <go> task represents the action of switching to a new card.

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>
<card>
<p>
 <anchor>
  Go To Test
  <go href="test.wml"/>
 </anchor>
</p>
</card> 
</wml>


Prev Task

The <prev> task represents the action of going back to the previous card.

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>
<card>
<p>
 <anchor>
  Previous Page
  <prev/>
 </anchor>
</p>
</card> 
</wml>


Refresh Task

The <refresh> task refreshes some specified card variables. If any of the variables are shown on the screen, this task also refreshes the screen.

The example below uses an <anchor> tag to add a "Refresh this page" link to the card. When the user clicks on the link, he or she refreshes the page and the value of the variable x will be set to 30:

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>
<card>
<p>
 <anchor>
  Refresh this page
  <go href="thispage.wml"/>
  <refresh>
   <setvar name="x" value="30"/>
  </refresh>
 </anchor>
</p>
</card>
</wml>


Noop Task

The <noop> task says that nothing should be done (noop stands for "no operation"). This tag is used to override deck-level elements.

The <do> tag can be used to activate a task when the user clicks on a word/phrase on the screen.

The example below uses a <do> tag to add a "Back" link to the card. When the user clicks on the "Back" link, he or she should be taken back to the previous card. But the <noop> tag prevents this operation; when the user clicks on the "Back" link nothing will happen: 

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">

<wml>
<card>
<p>
 <do name="back" type="prev" label="Back">
  <noop/>
 </do>
</p>
</card> 
</wml>


Task Elements

Start tag Purpose WML
<go>

Represents the action of switching to a new card

1.1
<noop> 

Says that nothing should be done (noop stands for "no operation"). Used to override deck-level elements

1.1
<prev>

Represents the action of going back to the previous card

1.1
<refresh> Refreshes some specified card variables. If any of the variables are shown on the screen, this task also refreshes the screen 1.1

learn1

clamp smoothstep step pow exp log//10为底 sqrt y = mod(x,0.5); // 返回 x 对 0.5 取模的值 //y = fract(x); // 仅...
  • u012540485
  • u012540485
  • 2018年01月23日 21:05
  • 5

c++ learn1

newline(换行符) /nhorizontal tab(水平制表键) /tvertical tab(垂直制表键) /vbackspace(退格键) /bcarriage return (回车键) ...
  • bitmap8
  • bitmap8
  • 2009年09月11日 16:32
  • 257

wap版下拉刷新,加载更多

用的是mobile jquery的手势做的下拉刷新。 下拉: 加载更多: 最近没分了,收两分啊。 下载地址:http://download.csdn.net/detail/u0...
  • u011693137
  • u011693137
  • 2015年03月17日 10:09
  • 992

手机wap前端开发经验

对于我们前端来讲,wap2.0开发无疑是对我们的一个考验,这个考验主要是考验我们对于重构方面的功底。下面主要分 UI、HTML、CSS、Javascript三方面给大家分享在wap2.0开发中的一些个...
  • zhjian6
  • zhjian6
  • 2015年03月18日 08:46
  • 6856

wap手机网页css(wap css)

wap手机网页css(wap css) 大部分手机现在都支持XHTML浏览器,这意味着我们只需在stylesheets的类型设置成“handheld”即 * { position: static...
  • lmx88
  • lmx88
  • 2010年10月20日 12:30
  • 5568

jquery幻灯轮播图,支持触屏wap站,代码如下。

基于jQuery的移动轮播图(支持触屏) .WSCSlideWrapper{ width: 420px; height: 180px; ...
  • muziduoxi
  • muziduoxi
  • 2014年06月27日 13:51
  • 6653

模拟新浪微博wap登录

闲来无聊,写了个新浪微博手机端mo
  • zhaolina004
  • zhaolina004
  • 2014年06月05日 22:04
  • 5296

WAP和web app的对比

最近有一个web网站需要提供对应的移动端的版本,客户要求说弄个wap网站就行,我一听感觉wap好遥远,应该还是智能机不流行的时候说wap,现在应该都是web app了。后来仔细研究了下,发现对wap的...
  • peachpi
  • peachpi
  • 2014年02月08日 05:04
  • 2459

WAP页上传图片

访问: wap.xxoo.com/home/index/test test操作 //测试 public function test(){ //显示模板 ...
  • leejianjun
  • leejianjun
  • 2016年11月25日 10:09
  • 768

wap开发语言

wap 2.0 开发语言为XHTML MP语言 wap 1.0 开发语言为,WML语言,  开发工具:vs.net2008的配置(asp支持wap2.0比较好,asp支持wap1.0的浏览器不好,...
  • hitlisheng
  • hitlisheng
  • 2013年06月04日 17:55
  • 1744
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:WAP Learn1
举报原因:
原因补充:

(最多只允许输入30个字)