JavaScript is an interpreted programming language. In this post we are going to go through the basic ways to use JavaScript without trying to boggle the mind of the reader with the finer details of JavaScript programming. Consider it an introduction to the technology that should leave you with a grasp of what JavaScript is all about (but not a language/syntax guide).
What's in a name...
The name JavaScript is sometimes a source of confusion. It should not be viewed as a relative of Java, Java Server Pages, etc. It does qualify as a scripting language, and has a lot in common with popular scripting languages like PHP. Technically they could be used for the same tasks. However, in this post we are focusing on common usage of web programming, which brings us to our next topic.
Client Side Code
JavaScript can be used for many things and in many ways but the most common is to automate or program some aspect of web browsing. The PHP language can also be used for many things, but it's focus is producing or processing web pages (It's even implied in the name, he H in PHP stands for hypertext). In the common usage of these 2 languages PHP is doing it's work on web page data before it reaches your browser. PHP is running on the server, meaning the computer hardware hosting the web site. Your computer, for the most part, doesn't pay attention to what happens before it gets the web page data, it may not be aware that PHP or another programming language is being used. A web page, produced with or without PHP, may use JavaScript as well. The JavaScript will not run on the server but will wait until your browser receives it. Then the browser will decide to run the JavaScript code. Your computer, or the browser it's self, could be called the client, so that means the JavaScript was client side code.
JavaScript can be in an HTML Document
JavaScript can be used inside an HTML document and can be as minimal as a single command. For example, you could have a standard .htm file on your server and normally no programming would be needed. Then imagine you wanted to print todays date. You would add the following inside your HTML document:
<script>
var currentTime = new Date();
document.write(currentTime.getMonth() + 1 + "/" + currentTime.getDate() + "/" + currentTime.getFullYear());
</script>
The first line starts the JavaScript block. Sometimes the tag says <script type="text/javascript">, but in modern HTML5 documents it's officially acceptable, and probably best, to just use <script>. The second line is needed to initialize the date features we will use (technically we call it "creating a new Date object"). The third is getting and writing the date. The final part is a tag to leave the JavaScript block, meaning what comes after is HTML.
JavaScript Files
Have no fear, JavaScript files are as easy to work with as any other file containing web page code, and you can just enter JavaScript into a text editor, no script tags needed. JavaScript files are ".js" files. It's usually still intended to interact with a web page, so add something like this to the HTML document:
<script src="script.js"></script>
In this case the file is called "script.js", and is assumed to be in the same folder. In your case you will need to make a JavaScript file and enter a proper path.
Sometimes JavaScript files are included to provide features (functions, classes etc.) that a website will use in the HTML portion of the page, these features could include:
Date Selection Dialog Boxes
Plots/Graphs
Spell Check
Color Pickers
Lightboxes
Slideshows
Clocks
Arrangeable Tables
Fetching Data From the Server
When a downloadable file provides features and usable code it may be called a library, plug-in, or widget depending on the situation. One thing a lot of code relies on is a library called JQuery. It can be a lot easier to code JavaScript when you have Jquery included, and you often can access more features. Look for our upcoming article on JQuery.
What's in a name...
The name JavaScript is sometimes a source of confusion. It should not be viewed as a relative of Java, Java Server Pages, etc. It does qualify as a scripting language, and has a lot in common with popular scripting languages like PHP. Technically they could be used for the same tasks. However, in this post we are focusing on common usage of web programming, which brings us to our next topic.
Client Side Code
JavaScript can be used for many things and in many ways but the most common is to automate or program some aspect of web browsing. The PHP language can also be used for many things, but it's focus is producing or processing web pages (It's even implied in the name, he H in PHP stands for hypertext). In the common usage of these 2 languages PHP is doing it's work on web page data before it reaches your browser. PHP is running on the server, meaning the computer hardware hosting the web site. Your computer, for the most part, doesn't pay attention to what happens before it gets the web page data, it may not be aware that PHP or another programming language is being used. A web page, produced with or without PHP, may use JavaScript as well. The JavaScript will not run on the server but will wait until your browser receives it. Then the browser will decide to run the JavaScript code. Your computer, or the browser it's self, could be called the client, so that means the JavaScript was client side code.
JavaScript can be in an HTML Document
JavaScript can be used inside an HTML document and can be as minimal as a single command. For example, you could have a standard .htm file on your server and normally no programming would be needed. Then imagine you wanted to print todays date. You would add the following inside your HTML document:
<script>
var currentTime = new Date();
document.write(currentTime.getMonth() + 1 + "/" + currentTime.getDate() + "/" + currentTime.getFullYear());
</script>
The first line starts the JavaScript block. Sometimes the tag says <script type="text/javascript">, but in modern HTML5 documents it's officially acceptable, and probably best, to just use <script>. The second line is needed to initialize the date features we will use (technically we call it "creating a new Date object"). The third is getting and writing the date. The final part is a tag to leave the JavaScript block, meaning what comes after is HTML.
JavaScript Files
Have no fear, JavaScript files are as easy to work with as any other file containing web page code, and you can just enter JavaScript into a text editor, no script tags needed. JavaScript files are ".js" files. It's usually still intended to interact with a web page, so add something like this to the HTML document:
<script src="script.js"></script>
In this case the file is called "script.js", and is assumed to be in the same folder. In your case you will need to make a JavaScript file and enter a proper path.
Sometimes JavaScript files are included to provide features (functions, classes etc.) that a website will use in the HTML portion of the page, these features could include:
Date Selection Dialog Boxes
Plots/Graphs
Spell Check
Color Pickers
Lightboxes
Slideshows
Clocks
Arrangeable Tables
Fetching Data From the Server
When a downloadable file provides features and usable code it may be called a library, plug-in, or widget depending on the situation. One thing a lot of code relies on is a library called JQuery. It can be a lot easier to code JavaScript when you have Jquery included, and you often can access more features. Look for our upcoming article on JQuery.
No comments:
Post a Comment