Function of HTML Tags
<!Doctype html> is just a declaration of the type of document.
<html> ... </html> house every other tag.
<head> ... </head> contain the title tags and a few meta-data (no-display) tags.
<title> ... </title> carries the title that is displayed on our browsers' title bar.
<body> ... </body>
contains the display tags that help mark-up what is shown on our
browsers' window.
For example, the <h3> ... </h2>
tags of the example from the previous page simply tells our
browsers to display
Here is a List of Even Numbers Between 2 and 100 Inclusive
as a level 3 heading.
<br/> is an example of a single tag element. It is used to insert like breaks (go to a new line).
<!-- ... --> are used to
enclose comments.
Comments are just remarks (explanations) you write along side your
code for clarity purposes (help you define what you are doing);
and also for future remembrance of what a piece of code was meant for.
The browser neither needs nor processes them.
Forms are used to collect input.
It has the following structure:
<form>
<input type="text">
<input type="button">
</form>
.
<input type="text"> is a text input element.
<input type="button"> is a button input element.
JavaScript Syntax
var is used to declare variables.
Variables are like your x and y
in algebra where x and y can take
any value.
Conditional operators like
if(){
...
} else {
...
}
give different options for different conditions.
For instance:
if(age > 18){
alert("You are grown-up now.");
} else {
alert("You are still young.");
}
Iteration operations are done using loops:
while loop:
while(){
...
}
and
for loop:
for(){
...
}
.
The arithmetic operators do exactly what you would expect:
+ means add;
- means subtract;
* means multiply;
/ means divide; and
% means moduli.
Note: Moduli means remainder after division.
Dividing 5 by 2 (5 ÷ 2) gives a remainder of 1.
Hence 5 % 2 = 1;
// are used for single line comments.
/* ... */ are used for multi-line comments.
Comments are just remarks (explanations) you write along side your
code for clarity purposes (help you define what you are doing);
and also for future remembrance of what a piece of code was meant for.
The browser neither needs nor processes them.
Tip: You don't need to write out comments
as you follow our daemonstrations
.
HTML Template Look.
<html lang="en">
<head>
<meta charset="utf-8" />
<title>A Title Goes Here</title>
</head>
<body>
Everything that is seen on the browser window
...
Is entered here.
</body>
</html>
JavaScript References:
For a more thorough explanation of JavaScript, please visit any of the following links:
w3Schools.com - contains a lot of examples; Simple to follow.
Home and learn - contains a lot of pictures and explanations; Ideal for total beginners.
Pick a Tutorial - contains a number of different tutorials on HTML to pick from; Suit yourself!