Updated:
Kate's JavaScript Page
Welcome to my liquid-layout page of JavaScript happiness! As I learn JavaScript I'd like to put some examples here for easy reference. What is JavaScript? If you think of HTML as the structure and content of a web page and the CSS as the way to style it, JavaScript is a programming language that adds interactive flair to your page. Among many other things, it may trigger a function when someone clicks on a button or validate a form to make sure an email address was entered. Maybe it highlights the content that has been updated since your viewer last visited. While your site shouldn't depend on JavaScript in case the viewer does not have their JavaScript enabled (for instance, to set up the navigation - you definitely need your navigation available to all viewers!) JavaScript is a great way to spice up an otherwise flat page of HTML and CSS. Back to Main Tutorial page.
Date Last Modified can be seen at the very top of the page.
Display Current Time: (on last reload)
Creating a variable: var numberBalls;
Creating and defining a variable: var numberBalls = 17;
Creating the variable then later defining it (use "var" keyword ONLY once at the introduction!): var numberBalls; numberBalls = 17;
TopWeb Document Info and Navigation:
Buttons that go back and reload page:
Spring a pop-up window when an image is clicked:
Top
Sort inputted data alphabetically:
Enter names in the entry field and watch what happens...
Simple Look-Up Form: (Compares against data stored in web page)
Three Methods for the Window Object:
Address inputting:
Cosmo's information has been inputted and his business card looks like:
Certain elements of it can be called separately simply by calling for them like this: document.write(cosmo.address)
Which looks like:
Time Conditional: Based on the time the following line will give you the proper greeting:
"For" Loop: Look at me! I can count! (Given a beginning number and an ending number and how many to add each time (in this case: 1 to 10 by 1)
TopRounding: Let's take the number 42.48971.
We will round up:
and round down:
and round to the nearest integer:
and round to the nearest dollar:
and how about a random number (from 1 to our number):
Check it out:
Random Numbers: Here's a function that takes the average of 5,000 computer generated random numbers to see just how random the computer is: (the closer to .5 the better)
What about 11 numbers?
What about 10 numbers?
5 numbers?
2 numbers?
I find this endlessly fascinating...
TopWatch this section - it'll do cool script.aculo.us things...
Javascript Websites and References:
- My Website
- Sams Teach Yourself JavaScript Book
- Script.aculo.us For snazzy built-in javascript effects.
Questions and comments:
- Questions:
- Why does my digital clock show the time as 9:7:52? I want it to be 9:07:52...
- How do I get the clocks to constantly update?
- To Do:
- Comments: