Welcome
................................
Schedule
................................
Calendar
................................
Guidelines
................................
Journaling
................................
Our Websites
...............................
Contact Info
...............................
Resources
...............................
Links
...............................
|
|
JavaScript Continued
You can make developing a website easier by implementing a bit of
JavaScript to eliminate redundant tasks.
Step One
Develop one page of your website. This will be our guide. I will be
using the basic table we used
to build our portfolio pages.
Step Two
Identify which elements of your webpage will be used on most if not
all parts of your website. The banner? The navigation? The footer?
For my page, it is both the banner and the navigation.
Step Three
I took this page and rewrote the
begining of it on an external javascript
page using the document.write(); function.
[Specifics on using a function is on the Basic JavaScript
page.]
Step Four
Paste your html into the parenthesis of the document.write function.
You must use backslashes(\) before any double
quotes(") or forward slashes(/) in
your JavaScript.
For example:
document.write();
becomes
document.write('<td background="red">text
goes here</td>');
now add the backslashes
'<td background=\"red\">text
goes here<\/td>'
Pretty easy, right?
Step Five
To include the js document (header.js), I included this line:
<script src="header.js" type="text/javascript"></script>
on each page.
Step Six
I also included footer.js at the bottom of each page:
<script src="footer.js" type="text/javascript"></script>
The Final Product
See how it works here.
The complete source code for the index page here.
Note:
Now if I want to change something in my banner or navigation I will
only have to change one file (header.js) instead of each individual
page. How sweet is that?!?
Additional resources
Here are some examples of basic JavaScript that
you can use.
Webmonkey's
JavaScript Code Library |
|
