2.2 HTML2 - Creating a Menu with JavaScript
OBJECTIVE
DISCUSSION
-
Updating pages when we change the common menu is time
consuming.
-
Use JavaScript to write out menu.
-
Import JavaScript file into each page.
-
Only need to modify JavaScript file when make change to menu.
Example Client Page (Client page = page that has the menu on
it)
<html>
<head>
<script src = "myScript.js"></script>
</head>
<body>
<table width="100%" height = "100%">
<tr valign = "top">
<td width = "150px" bgcolor="yellow">Contents<br>
<script>writeMenu("")</script>
</td>
<td>Main stuff here
</td>
</tr>
</table>
</body>
</html>
Example Code in JavaScript File
function writeMenu(pathToJS) {
document.write("<a href = '" + pathToJS + "http://cnn.com'>cnn</a><br>");
}
EXERCISES
-
Create a "client page" by copying and pasting the above code
into a new page.
-
Create the JavaScript page by copying and pasting
the above code into a file named myScript.js.
-
Test your page.
-
Add a link to another page that is in the same directory as
your "client page".
-
Add a link to a page in another directory.
-
Add the menu to the page in the other directory.
LINKS AND HELP