Building a web site from scratch. Part III: Adding computer code (JavaScript).
What We Will Do
In this chapter we will:
- Create some computer code (JavaScript)
- Add a link to the script in your pages
Create JavaScript
In the demoweb folder, create a new file named script.js.
Put the following code inside the file:
script.js
document.getElementById("foot01").innerHTML =
"<p>© " +
new Date().getFullYear()
+ " w3ii. All rights reserved.</p>";
Edit the Home Page
In the demoweb folder, edit the file index.html.
Change the content to the following:
index.html
<!DOCTYPE html>
<html>
<head>
<title>Our Company</title>
<link href="site.css" rel="stylesheet">
</head>
<body>
<div id="main">
<h1>Welcome to Our Company</h1>
<h2>Web Site Main Ingredients:</h2>
<p>Pages (HTML)</p>
<p>Style Sheets (CSS)</p>
<p>Computer Code (JavaScript)</p>
<p>Live Data (Files and Databases)</p>
<footer id="foot01"></footer>
</div>
<script src="script.js"></script>
</body>
</html>
Try it Yourself »
The page above, is a copy of the page from the previous chapter, with an added footer, and a link to a script.
Edit the About Page
To complete your work, do the same changes in about.html.
1. Add a <footer> element.
2. Include the script.
Change the content to the following:
about.html
<!DOCTYPE html>
<html>
<head>
<title>About</title>
<link href="site.css" rel="stylesheet">
</head>
<body>
<div id="main">
<h1>About Us</h1>
<p>Lorem Ipsum Porem Lorem Ipsum Porem</p>
<footer id="foot01"></footer>
</div>
<script src="script.js"></script>
</body>
</html>
Try it Yourself »
Read More
Read more about JavaScript in our JavaScript Tutorial.