Website tips

Section of the index   A B C D E F G H I J K L M N O P Q R S T U V W X Y Z

Tables

The Table is placed in, using the table function, to put one in quickly highlight the squares to indicate rows and columns and click. This one is set to cell width 200px to prevent it spreading out.
If you use the 'precisely' part of the table insert the width setting indicates the total width of the table.
Setting cell width
Right click on the cell and set width in table cell properties. Can use the handles to adjust width and heght of table.
Inserting a row
To insert a row right click and insert above or below. Columns are inserted and removed in the same manner.

Rows can also be inserted using the 'tab' key.

Links and Anchors Kompozer

Links appear in Kompozer as an 'A' resting the cursor on this shows the anchor that it is aimed at. To change the link doubleclick the 'A' and a dropdown menu of existing anchors can be chosen from.

Removing a link did not prove too easy so I resorted to editing the html in Dreamweaver where the code is set out in a more legible manner.

Controls

Show the site manager in the side-bar (use view menu).

Editing the trust site in kompozer

display the html in the asp window, select all and copy. open Kompozer in the source window and paste in the html after deleting the contents of this window. The editing can now be done, paste the html back afterwards.

Html Tips

Inserting a superscript figure
 eg. 12⁶ place the following code after the 12 ⁶. Note: in order to use reserved characters on a web page the html for < is &lt; html for > is &gt;

Embedding a comment in HTML use the following: <!—whatever text you want here-->

This adds the 'normal formatting for Trust site: <a href="#extra"><font class=" Normal ">Adding extra tests</font></a>

Tips from the Dreamweaver book

To remove a table row:
Ctrl shift M.
To insert a table row:
Ctrl M.
Or use the tab key.
To be able to insert a table to align fully left place it within the dotted lines of the table above.
None breaking spaces:
 Ctrl-shift-spacebar.
Allowing multiple consecutive spaces:
 Preferences-general-allow multiple consecutive spaces.
Link to anchor on another page:
otherpage.htm#anchor.
Underline text
text-style-underline
To paste text = control V

Cut text = control x

Copy = control C

Undo = Control z

Layers

If you nest a layer inside another layer you can state absolutely how far you want that nest to appear from the outer layer border (top bottom left or right).

Picture viewer 

Copy and paste the java html into the page, ensure that the .jar file is present in the site and put images in the appropriate folder. Modify the html to point to the correct images.

Javascript

Place a comment: anything following // on a line is ignored. Also anything between /* and */ is ignored. Don't forget in HTML anything between <!-- and --> is ignored.

Input text : text = prompt ("Enter some text.")

Output text:     Use the document.write(xxx) object function to print text. also can use the document.writeln(xxx) which adds a line break.

Increment a variable:    x=x+1    can be x += 1   or   x++,    ++x increments the variable before the operation.   To decrement substitute the - sign.

You can add extra characters to a string variable by this method sentence += "." adds a fullstop to the sentence string.

String to number   parseInt and parseFloat can be used.

stringvar = "30 polar bears ";   parseInt(stringvar) = 30.

Line breaks    use document.write("<br/>")

Getting parts of a string   if alpha is a variable containing all of the alphabet alpha.substing(0,4) returns 'ABCD'. The first character in a string is numbered '0' and the second number in the method '4' is noninclusive. To get a single character alpha.charAt(0) returns 'A' . alpha.indexOf("def") .

Arrays   Declaring an array can be done in several different ways. scores = new Array(4); Then enter values: scores[0] = 56; scores[1] = 60; scores[2] = 23; scores[3] = 25; The length of an array does not have to be declared scores = new Array(); to this you can assign values to elements: scores[1] = 21; scores[5] = 26;

or you could do the equivalent with scores = new Array(56,60,23,25);

or more concisely scores = [56,60,23,25];

scores.length gives the number of elements in an array called 'scores'.

Splitting strings into String Arrays  name = "T J Hooker"; parts = name.split(" "); The variable is split wherever there is a space, returning parts[0] = "T"; parts[1] = "J"; and parts[2] = "Hooker";

The name string could be reassembled using parts.join(" "); The space in the parentheses puts a space between the three bits of the name.

Convert a number to a string:
var num = 15;
var n = num.toString();

The result of n will be:
15

Try it yourself »
Definition and Usage

The toString() method converts a Number object to a string.
Browser Support

The toString() method is supported in all major browsers.
Syntax
number.toString(radix)
Parameter ValuesParameter Description
radix Optional. Which base to use for representing a numeric value. Must be an integer between 2 and 36.
2 - The number will show as a binary value
8 - The number will show as an octal value
16 - The number will show as an hexadecimal value

Return ValueType Description
String The number as a string

Technical DetailsJavaScript Version: 1.1

More Examples
Example

Convert a number to a string, using different bases:
var num = 15;
var a = num.toString();
var b = num.toString(2);
var c = num.toString(8);
var d = num.toString(16);

The result of a,b,c, and d will be:
15
1111
17
f

Objects An object can store the values for a number of variables and can have functions as well.

Defining a business card object:

function Card(name,address,work,home) {

this.name = name;
this.address = address;
this.work = workphone;
this.home = homephone;

}

function Printcard() {
line1 = "Name: " + this.name + "<br>\n";
line2 = "Address: " + this.address + "<br>\n";
line3 = "Work phone: " + this.workphone + "<br>\n";
line4 = "Home phone: " + this.homephone + "<br>\n";
document.write(line1, line2, line3, line4);
}

The Printcard function needs to be included in the object definition:

function Card(name,address,work,home) {

this.name = name;
this.address = address;
this.work = workphone;
this.home = homephone;
this.Printcard = Printcard;

}

The Printcard function is now a Method of the Card object.

An object instance defines a single instance of the card object.

tom = new Card ("Tom Jones", "22, Sale Lane ", "123456", "7891011");

Prototypes  Prototypes can be used to extend built-in objects by adding properties and methods.

Logical operators  == Is equal to, != Is not equal to, < Is less than, > Is greater than, >= Is greater than or equal to, <= Is less than or equal to.

if (phone == "") window.alert("error!").

To combine operators:
if (phone == "" || email == "") window.alert("something's missing!");

If Statement

Use the if statement to execute some code only if a specified condition is true.

Syntax

Note that if is written in lowercase letters. Using uppercase letters (IF) will generate a JavaScript error!

Example

Make a "Good day" greeting if the time is less than 20:00:

The result of x will be:

Notice that there is no ..else.. in this syntax. You tell the browser to execute some code only if the specified condition is true .

If...else Statement

Use the if....else statement to execute some code if a condition is true and another code if the condition is not true.

Syntax

Example

If the time is less than 20:00, you will get a "Good day" greeting, otherwise you will get a "Good evening" greeting

The result of x will be:

If...else if...else Statement

Use the if....else if...else statement to select one of several blocks of code to be executed.

Syntax

Example

If the time is less than 10:00, you will get a "Good morning" greeting, if not, but the time is less than 20:00, you will get a "Good day" greeting, otherwise you will get a "Good evening" greeting:

The result of x will be:

In short notation: value = (a==1) ? 1 : 0;

The switch statement can be used in place of repetative if then else.

Loops

For loops normallytake the form:   for (i=0; i<10; i++) { } braces containe the code to be executed until i reaches the set value.

While loops   while (total < 10) {
n++;
total += values[n];
}

adds the values of the array array until it exceeds 10 (+= means' increment by')

do.....while loops   this is like a while loop, but the condition is tested at the end of each iteration rather than at the beginning.
do {
n++;
total += values[n];
}
while (total <10);

Similar, but condition tested at the end.

break and continue within a loop the statement: if (values[n] ==1) break; causes the loop to finish if an element of the array 'values' is equal to 1.
The statement if (score[i]==0) continue; causes the rest of the loop in the particular instance where score[i] is equal to 0, to be ignored, but next iteration of the loop continues.

If you are not sure that the loop is going to terminate include the following statement which waits for a response in each loop.
toomuch = prompt("ok to continue?");
if (toomuch == "n") break;

for...in loop  Specifically designed to to perform an operation on each property of an object.
for (i in navigator) {
document.write("property: " + i);
document.write("value: " + navigator[i] + "<br/>");
}

The navigator object contains properties that describe the users browser, these are displayed.

"<li>" tag gives the list number of an entered list.

Math Functions

Math.floor(x) rounds x down to an integer
Math.abs(a) // the absolute value of a
Math.acos(a) // arc cosine of a
Math.asin(a) // arc sine of a
Math.atan(a) // arc tangent of a
Math.atan2(a,b) // arc tangent of a/b
Math.ceil(a) // integer closest to a and not less than a
Math.cos(a) // cosine of a
Math.exp(a) // exponent of a (Math.E to the power a)
Math.floor(a) // integer closest to a, not greater than a
Math.log(a) // log of a base e
Math.max(a,b) // the maximum of a and b
Math.min(a,b) // the minimum of a and b
Math.pow(a,b) // a to the power b
Math.random() // pseudorandom number 0 to 1 (see examples)
Math.round(a) // integer closest to a (see rounding examples)
Math.sin(a) // sine of a
Math.sqrt(a) // square root of a
Math.tan(a) // tangent of a
Math,truncate(x)

Math properties
Properties
E
Euler's constant and the base of natural logarithms, approximately 2.718.
LN2
Natural logarithm of 2, approximately 0.693.
LN10
Natural logarithm of 10, approximately 2.303.
LOG2E
Base 2 logarithm of E, approximately 1.443.
LOG10E
Base 10 logarithm of E, approximately 0.434.
PI
Ratio of the circumference of a circle to its diameter, approximately 3.14159.
SQRT1_2
Square root of 1/2; equivalently, 1 over the square root of 2, approximately 0.707.
SQRT2
Square root of 2, approximately 1.414.

AJAX

Creating a request object suitable for all browsers

var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

Members

The XMLHttpRequest object has these types of members:

• Events
• Methods
• Properties

Events

The XMLHttpRequest object has these events.

Methods

The XMLHttpRequest object has these methods.

Properties

The XMLHttpRequest object has these properties.

The innerHTML property can be used to modify your document's HTML on the fly.

When you use innerHTML, you can change the page's content without refreshing the page. This can make your website feel quicker and more responsive to user input.

The innerHTML property is used along with getElementById within your JavaScript code to refer to an HTML element and change its contents.

The innerHTML property is not actually part of the official DOM specification. Despite this, it is supported in all major browsers, and has had widespread use across the web for many years. DOM, which stands for Document Object Model, is the hierarchy that you can use to access and manipulate HTML objects from within your JavaScript.
The innerHTML Syntax

The syntax for using innerHTML goes like this:

document.getElementById('{ID of element}').innerHTML = '{content}';document.getElementById('{ID of element}').innerHTML = '{content}';

<script type="text/javascript">
function Msg1(){
document.getElementById('myText').innerHTML = 'Thanks!';
}
function Msg2(){
document.getElementById('myText').innerHTML = 'Try message 1 again...';
}
</script>
<input type="button" onclick="Msg1()" value="Show Message 1" />
<input type="button" onclick="Msg2()" value="Show Message 2" />
<p id="myText"></p>