06/11/2014

What is JavaScript ?

| |
0 comments

What is JavaScript ?

JavaScript started life as LiveScript, but Netscape changed the name, possibly because of the excitement being generated by Java.to JavaScript. JavaScript made its first appearance in Netscape 2.0 in 1995 with a name LiveScript.

JavaScript is a lightweight, interpreted programming language with object-oriented capabilities that allows you to build interactivity into otherwise static HTML pages.

The general-purpose core of the language has been embedded in Netscape, Internet Explorer, and other web browsers

The ECMA-262 Specification defined a standard version of the core JavaScript language.

  • JavaScript is:JavaScript is a lightweight, interpreted programming language
  • Designed for creating network-centric applications
  • Complementary to and integrated with Java
  • Complementary to and integrated with HTML
  • Open and cross-platform

Client-side JavaScript:


Client-side JavaScript is the most common form of the language. The script should be included in or referenced by an HTML document for the code to be interpreted by the browser.

It means that a web page need no longer be static HTML, but can include programs that interact with the user, control the browser, and dynamically create HTML content.

The JavaScript client-side mechanism features many advantages over traditional CGI server-side scripts. For example, you might use JavaScript to check if the user has entered a valid e-mail address in a form field.

The JavaScript code is executed when the user submits the form, and only if all the entries are valid they would be submitted to the Web Server.

JavaScript can be used to trap user-initiated events such as button clicks, link navigation, and other actions that the user explicitly or implicitly initiates.

Advantages of JavaScript:


The merits of using JavaScript are:
  • Less server interaction: You can validate user input before sending the page off to the server. This saves server traffic, which means less load on your server.
  • Immediate feedback to the visitors: They don't have to wait for a page reload to see if they have forgotten to enter something.
  • Increased interactivity: You can create interfaces that react when the user hovers over them with a mouse or activates them via the keyboard.
  • Richer interfaces: You can use JavaScript to include such items as drag-and-drop components and sliders to give a Rich Interface to your site visitors.
 

Limitations with JavaScript:


We can not treat JavaScript as a full fledged programming language. It lacks the following important features:
  • Client-side JavaScript does not allow the reading or writing of files. This has been kept for security reason.
  • JavaScript can not be used for Networking applications because there is no such support available.
  • JavaScript doesn't have any multithreading or multiprocess capabilities.

Once again, JavaScript is a lightweight, interpreted programming language that allows you to build interactivity into otherwise static HTML pages.

JavaScript Development Tools:


One of JavaScript's strengths is that expensive development tools are not usually required. You can start with a simple text editor such as Notepad.

Since it is an interpreted language inside the context of a web browser, you don't even need to buy a compiler.

To make our life simpler, various vendors have come up with very nice JavaScript editing tools. Few of them are listed here:
  • Microsoft FrontPage: Microsoft has developed a popular HTML editor called FrontPage. FrontPage also provides web developers with a number of JavaScript tools to assist in the creation of an interactive web site.
  • Macromedia Dreamweaver MX: Macromedia Dreamweaver MX is a very popular HTML and JavaScript editor in the professional web development crowd. It provides several handy prebuilt JavaScript components, integrates well with databases, and conforms to new standards such as XHTML and XML.
  • Macromedia HomeSite 5: This provided a well-liked HTML and JavaScript editor, which will manage their personal web site just fine.

Read More

JavaScript Introduction

| |
0 comments

JavaScript Introduction

 JavaScript is the most popular programming language in the world.

It is the language for HTML, for the Web, for computers, servers, laptops, tablets, smart phones, and more.

This page contains some examples of what JavaScript can do in HTML.

JavaScript Can Change HTML Elements:


The HTML DOM (the Document Object Model) is the official W3C standard for accessing HTML elements.

JavaScript can manipulate the DOM (change HTML contents).

The following example changes the content (innerHTML) of an HTML element identified with id="demo":  

Example:
Coding:
<!DOCTYPE html>
<html>
<body>

<h1>My First JavaScript</h1>

<p>JavaScript can change the content of an HTML element:</p>

<button type="button" onclick="myFunction()">Click Me!</button>

<p id="demo">This is a demonstration.</p>

<script>
function myFunction() {
    document.getElementById("demo").innerHTML = "Hello JavaScript!";
}
</script>

</body>
</html>

Demo

The method document.getElementById() is one of many methods in the HTML DOM.

You can use JavaScript to:
  • Change HTML elements
  • Delete HTML elements
  • Create new HTML elements
  • Copy and clone HTML elements
  • And much more ...
There are several chapters, about the HTML DOM, later in this tutorial.

JavaScript Can Change HTML Attributes:


This example changes the value of the source attribute (src) of an HTML <img> element:

Example:
Coding:
<!DOCTYPE html>
<html>
<body>

<img id="myImage" onclick="changeImage()" src="pic_bulboff.gif" width="100" height="180">

<p>Click the light bulb to turn on/off the light.</p>

<script>
function changeImage() {
    var image = document.getElementById('myImage');
    if (image.src.match("bulbon")) {
        image.src = "pic_bulboff.gif";
    } else {
        image.src = "pic_bulbon.gif";
    }
}
</script>

</body>
</html>

Demo

With JavaScript, you can change almost any HTML attribute.

JavaScript Can Change HTML Styles (CSS):


Changing the style of an HTML element, is a variant of changing an HTML attribute.

Example:
Coding:
<!DOCTYPE html>
<html>
<body>

<h1>My First JavaScript</h1>

<p id="demo">JavaScript can change the style of an HTML element.</p>

<script>
function myFunction() {
    var x = document.getElementById("demo");
    x.style.fontSize = "25px";         
    x.style.color = "red";
}
</script>

<button type="button" onclick="myFunction()">Click Me!</button>

</body>
</html>

Demo

With JavaScript, you can change almost any CSS value.

JavaScript Can Validate Data:


JavaScript is often used to validate input:

Example:
Coding:
<!DOCTYPE html>
<html>
<body>

<p>Please input a number between 1 and 10:</p>

<input id="numb" type="number">

<button type="button" onclick="myFunction()">Submit</button>

<p id="demo"></p>

<script>
function myFunction() {
    var x, text;

    // Get the value of input field with id="numb"

    x = document.getElementById("numb").value;

    // If x is Not a Number or less than one or greater than 10

    if (isNaN(x) || x < 1 || x > 10) {
        text = "Input not valid";
    } else {
        text = "Input OK";
    }
    document.getElementById("demo").innerHTML = text;
}
</script>

</body>
</html>

Demo

Did You Know?
*JavaScript and Java are different languages, both in concept and design.

JavaScript was invented by Brendan Eich, to be used in Netscape (a no longer existing browser) in 1995,
and was adopted by the ECMA standard association in 1997.

ECMA-262 is the official name. ECMAScript 5 (version 1.8.5 - July 2010) is the latest standard.
Read More

27/08/2014

JavaScript-Validation Script

| |
0 comments
JavaScript-Validation Script


 
 
 
 
email validation:


/^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i

******************************************************************************

Alphabets, numbers and space(' ') no special characters min 3 and max 20

characters.

var ck_name = /^[A-Za-z0-9 ]{3,20}$/;

******************************************************************************

Supports alphabets and numbers no special characters except underscore('_') min 3

and max 20 characters.

var ck_username = /^[A-Za-z0-9_]{3,20}$/;

******************************************************************************

Password

Password supports special characters and here min length 6 max 20 charters.

var ck_password = /^[A-Za-z0-9!@#$%^&*()_]{6,20}$/;
Read More

Check Your Codes

Check the result of your (sample) HTML,CSS,JavaScript code.