HTML and CSS Reference
In-Depth Information
We're going to create a bare-bones web page to use as a template for the examples
in this chapter. Create a directory named jstemplate (on your desktop or wherever
is convenient for you to access). You'll use this directory as a starting template for the
examples in this chapter. Launch your favorite text editor, and create the following web
page:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>HTML5 Apprentice</title>
<link rel="stylesheet" type="text/css"
href="css/styles.css" />
<script
type="text/javascript"
sr-
c="js/script.js" defer></script>
</head>
<body>
<p>Content goes here!</p>
</body>
</html>
Save this code as a file named index.html in the jstemplate directory you
created. Create a second page for the JavaScript named script.js and place it in a
directory called js inside the jstemplate directory.
Write the following JavaScript in script.js :
// init function runs when page has fully loaded
function init() {
// code to run
}
window.onload = init;
This script will run the function init when the page has fully loaded.
Lastly, create an empty CSS style sheet (just an empty text file at this stage) named
styles.css and place it in a directory called css inside the jstemplate directory.
Accessing DOM properties and methods
Chapter 1 provided an overview of the DOM, which describes the elements on a page
as a connected tree-like structure (technically an acyclic connected graph), which can
Search WWH ::




Custom Search