This is part 2 of my series, JavaScript Basics. In this part of the series, I explain how to output or display JavaScript Information.
If you think anything is missing for this article, just contact me at forchatrans@yahoo.com
The Alert Box
JavaScript has a box, which you can use to display JavaScript information. This box usually appears like a small rectangle and it is usually gray in color. The syntax to display information is:
alert(string);
You have the word "alert". After the word you have parentheses. Inside the parentheses you have text in single or double quotes. It is this text that is displayed in the alert box. The whole line above that ends with a semi-colon, is an example of what is called a JavaScript statement. The word "alert" with its parentheses is an example of what is called a function.
Assume that you want to display the following string:
"I love JavaScript."
The statement you type, would be:
alert("I love JavaScript.");
It could also be:
alert('I love JavaScript.');
The first alert statement uses double quotes. The second one uses single quotes. At this point, I should warn you about quotations. The double or single quotation marks offered by your word processor (e.g. Microsoft Word), are not the ones you should use in your code. The quotation marks you use should be the ones offered by your text editor. The quotation marks offered by your text editor are not the same in shape as the ones offered by your word processor.
Example of Alert Box
The following code will display an alert box with the content of the string, "I love JavaScript."
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
alert('I love JavaScript.');
Try the above code. You should see the alert box, with the sentence.
Inserting into the Page
You can insert information into the current page. The information will appear below what is already on the page. The syntax for the statement is:
document.write(string);
You begin with the word, "document"; this is followed by a dot, then the word, "write", and then, parentheses. Inside the parentheses you have a string. The word, document, here, represents what is called an Object, in JavaScript. The word, "write" with parentheses is an example of what is called a function.
The following code will insert the sentence, "I love JavaScript." into the current page:
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Current Page.
document.write('I love JavaScript.');
Current Page.
Try the code. In the code, the string is in single quotes. You can still use double quotes. At the browser, the string is inserted at the position where the JavaScript is.
Replacing HTML Content
You can use JavaScript to replace the content of an HTML element. You can use it to replace the content of a paragraph element, for example. You need to understand other JavaScript principles first, before you can understand how to do this. So we shall look at this later.
JavaScript Statement
A statement in JavaScript is a short piece of code that usually ends with a semicolon.
JavaScript Version
The latest version of JavaScript is version 1.5. In this tutorial series, all what I give you is based on version 1.5.
Let us stop here and continue in the next part of the series.
Chrys
Published by Chrys Forcha
I have more than 10 years experience in computer programming, software, electronics and telecommunications. I have a First Degree in Electronics and a Master's Degree in Technical Education. As well a... View profile
- Some Applications of the CSS Fixed PositioningIn this article, I give you some applications of CSS Fixed Positioning.
- Understanding CSS Absolute Positioning and LayeringIn this article, I give you an in-depth explanation of CSS Absolute Positioning.
- Understanding CSS Fixed PositioningIn the article I give you an in depth explanation of CSS Fixed Positioning.
- CSS Dimensions and ResolutionsIn this part of the series, I talk about the width and height of HTML elements, as governed by CSS and their effects on different computer screen resolutions.
- JSON FileIn this article, I explain the meaning of JSON File.
- Guide to XHTML Layout in Containing Blocks
- CSS Surrounding Element Properties
- Designing an XHTML Form
- Basics of XHTML Form Controls
- XHTML Table Basics
- CSS List
- CSS Classification
