The HTML Document

Listing 11.1 shows the code for our HTML page.

Listing 11.1. The HTML Page for Our Ajax Application

 

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Ajax Demonstration</title>
<style>
.displaybox {
width:150px;
background-color:#ffffff;
border:2px solid #000000;
padding:10px;
font:24px normal verdana, helvetica, arial, sans-serif;
}
</style>
</head>
<body style="background-color:#cccccc; text-align:center">

<h1>Ajax Demonstration</h1>
<h2>Getting the server time without page refresh</h2>
<form>
<input type="button" value="Get Server Time" />
</form>
<div id="showtime" class="displaybox"></div>

</body>
</html>

 

This is a simple HTML layout, having only a title, subtitle, button, and <div> element, plus some style definitions.

Tip

 

In HTML the <div> ... </div> element stands for division and can be used to allow a number of page elements to be grouped together and manipulated in a block.

 

Figure 11.1 shows what the HTML page looks like.

Figure 11.1. The HTML file of Listing 11.1.

[View full size image]