Training Guide: Programming in HTML5 with JavaScript and CSS3 Ebook

(Nora) #1

Practice exercises CHAPTER 5 245


The main <div> element with the calculator <div> element should look like the
following.
<div role="main">
<div id="calculator">
<input id="txtResult" type="text" readonly="readonly" /><br />
<input id="txtInput" type="text" /><br />
<button id="btn7">7</button>
<button id="btn8">8</button>
<button id="btn9">9</button><br />
<button id="btn4">4</button>
<button id="btn5">5</button>
<button id="btn6">6</button><br />
<button id="btn1">1</button>
<button id="btn2">2</button>
<button id="btn3">3</button><br />
<button id="btnClear">C</button>
<button id="btn0">0</button>
<button id="btnClearEntry">CE</button><br />
<button id="btnPlus">+</button>
<button id="btnMinus">-</button>
</div>
</div>


  1. After the main
    element, insert an

  2. After the


The following is the complete default.html webpage.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Web Calculator</title>
<link href="Content/default.css" rel="stylesheet" />
<script type="text/javascript" src="Scripts/CalculatorLibrary.js"></script>
</head>
<body>
<div id="container">
Free download pdf