A Brief Look at JavaScript - Web Development and Design Foundations with XHTML - page 549

Edit the variablewrite2.html file as follows:
<script type="text/javascript">
<!-- <![CDATA[
var userName;
userName = prompt("Please enter your name");
document.write("<h2>Hello " + userName + "</h2>");
// ]]> -->
</script>
Only the userName variable assignment command has changed. The data typed by the
user will be assigned to the variable, userName .
Save the file as variablewrite3.html file and display it in the browser. The prompt box
will appear and you can type a name in the input box, and click the OK button, as
shown in Figure 14.14. The name should appear in the browser window.
Figure 14.14
The prompt box is
displayed in the
browser when the
Web page is loaded
Let's do a variation on this and allow the user to type a color name. The user's prefer-
ence will be used as the background color of the document. We will use the bgColor
property of the document object and set it to the user's color preference. Pay attention
to case, and ensure that the uppercase C is used when typing bgColor .
Edit the variablewrite3.html document as follows, and save it as
changebackground.html.
<script type="text/javascript">
<!-- <![CDATA[
var userColor;
userColor = prompt("Please type the color name blue or red");
document.bgColor = userColor;
// ]]> -->
</script>
We are prompting the user to type the color name “blue” or “red.” You know from your
XHTML experience that there are more options for color names. Feel free to experiment!