Search The Website

Content:

JavaScript Tutorial, JavaScript Syntax, Java Scripts Examples, and Useful Links.

JavaScript Tutorial

JavaScript to program the behaviour of dynamic, interactive web pages.
JavaScript Features
The following features are common to all conforming ECMAScript implementations, ( ECMAScript is the scripting language standardized by Ecma International in the ECMA-262 specification and ISO/IEC 16262. The language is widely used for client-side scripting on the Web, in the form of several well-known implementations such as JavaScript, JScript and ActionScript.) unless explicitly specified otherwise.

Imperative and structured: JavaScript supports much of the structured programming syntax from C , statement such as if, and while loops ... etc.

Dynamic:
Dynamic typing: As in most scripting languages, types, are associated with values, not with variables.

Object-based: JavaScript is almost entirely object-based. JavaScript objects are associative arrays, They support two equivalent syntaxes: dot notation (obj.x = 10) and bracket notation (obj['x'] = 10).

Run-time evaluation: JavaScript includes an eval function that can execute statements provided as strings at run-time.

Functional: Functions are first-class; they are objects themselves. As such, they have properties and methods, such as .call() and .bind().

Including JavaScript Libraries: to use a JavaScript framework library in your web pages, just include the library in a <script> tag.

Google AJAX provides the links for the majority of JavaScript libraries including:
AngularJS, Dojo, Ext Core, jQuery, jQuery Mobile, jQuery UI, MooTools, Prototype, SPF, SWFObject, three.js, and Web Font Loader.

Yahoo provide an extensive JavaScript library (The YUI):
<script src = "http:// yui.yahooapis.com / 3.18.1 / build/yui/yui-min.js" > </script>

JavaScript Syntax

JavaScript Syntax: Wikipedia provide good description to JavaScript Syntax.

Simple examples:
Variables in JavaScript can be defined using the var keyword:

var x; // defines the variable x, although no value is assigned to it by default
var y = 2; // defines the variable y and assigns the value of 2 to it

Note the comments in the example above, both of which were preceded with two forward slashes.

There is no built-in I/O functionality in JavaScript;
... indeed, there are no provisions in this specification for input of external data or output of computed results.

However, most runtime environments have a console object that can be used to print output. Here is a minimalist Hello World program:
console.log ("Hello World!");
A simple recursive function:

Tfunction factorial(n) {
if (n == 0) {
return 1;
}

JavaScript Examples

You may learn JavaScript by examples: ( W3 School ).

Example 1: is about JavaScript, and how JavaScript works with HTML and CSS.

<button type = "button" onclick = "document.getElementById ('demo1').innerHTML = Date()"> Display Date and Time </button>
<p id ="demo1"></p>

Example 2: JavaScript can change HTML content.

<button type = "button" onclick = "document.getElementById ('demo2').innerHTML = 'Hello JavaScript!'"> Hello JavaScript! </button>
<p id = "demo2"> </p>

Example 3 JavaScript Can Change Images

<img id = "BulbImage" onclick = "changeImage()" src = "images/pic_bulboff.gif" width = "100" height = "180">
<script>
     function changeImage() {
          var image = document.getElementById ('BulbImage');
          if ( image.src.match("bulbon" ) )   {
               image.src = "images / pic_bulboff.gif";
          } else {
               image.src = "images / pic_bulbon.gif";
              }
          }
</script>
<p> Click the light bulb to turn on/off the light. </p>

Click the light bulb to turn on/off the light.

Example 4 JavaScript can change the style of an HTML element.

JavaScript can change the style of an HTML element.

Example 5 JavaScript Can Validate Input

<p>Please input a number between 1 and 10:</p>
<input id = "numb" type = "number">
<button type = "button" onclick = "Function5()"> Submit </button>
<p id = "demo5"> </p>
<script>
     function Function5() {
          var j, text;
// Get the value of the input field with id = "numb"
          j = document.getElementById ("numb") .value;
// If j is Not a Number or less than one or greater than 10
          if (isNaN(j) || j < 1 || j > 10) {
               text = "<b>Input not valid</b>";
         } else {
               text = "<b>Input OK</b>";
                   }
          document.getElementById ("demo5").innerHTML = text;
      }
</script>