Monday 21 May 2012

javaScript Tutorial

javaScript Variables javaScript Operators javaScript if, else if and else

javaScript Switch javaScript Functions javaScript Popup Boxes javaScript For,While Loop javaScript Break Loop javaScript Continue Loop javaScript Objects javaScript Validate Forms

javaScript Introduction

JavaScript is the most popular object-oriented client-side scripting language on the internet, and works in all major browsers,such as Internet Explorer, Firefox, Chrome, Opera, and Safari.

JavaScript is a scripting language that is added to standard HTML to create interactive documents. Css

What You Should Already Know
Before you continue you should have a basic understanding of the following:

HTML

If you want to study these subjects first, find the tutorials on our Home page.
What is JavaScript?

JavaScript is a scripting language
JavaScript evolved from Netscape's LiveScript language. First released with Navigator 2.0.
JavaScript is usually embedded directly into HTML pages
JavaScript is object-oriented client-side scripting language.

Are Java and JavaScript the same?

NO!

Java and JavaScript are two completely different languages in both concept and design!
Java is an Object Oriented Programming (OOP) language created by James Gosling of Sun Microsystems.
JavaScript was created by the fine people at Netscape. JavaScript is only loosely related to Java, and is not a true object-oriented language.

The main difference is that Java can stand on its own while JavaScript must be placed inside an HTML document to function.

Comparison table of JavaScript and Java
JavaScript	Java
Easy to learn and use	Complicated to learn and use
Useful for simple tasks	Useful for complex tasks
No developer's kit required	Requires Java Developer Kit to create applets
JavaScript code is written directly in HTML and it does not require compiling	Java programs are saved in separate files and must be compiled before they can be run

What can a JavaScript do?

Display information based on the time of the day JavaScript can check the computer's clock and pull the appropriate data based on the clock information.
Detect the visitor's browser JavaScript can be used to detect the visitor's browser, and load another page specifically designed for that browser.
Control Browsers JavaScript can open pages in customized windows, where you specify if the browser's buttons, menu line, status line or whatever should be present.
Validate forms data JavaScript can be used to validate form data at the client-side saving both the precious server resources and time.
Create Cookies JavaScript can store information on the visitor's computer and retrieve it automatically next time the user visits your page.
Add interactivity to your website JavaScript can be set to execute when something happens, like when a page has finished loading or when a user clicks on a button.
Change page contents dynamically JavaScript can randomly display content without the involvement of server programs. It can read and change the content of an HTML element or move them around pages.

The Real Name is ECMAScript

ECMAScript is developed and maintained by the ECMA organization.
ECMAScript is an attempt at the industry-wide standardization of JavaScript and JScript. As JavaScript was developed by Netscape and is currently continuing to be developed by the Mozilla Project, Microsoft came out with JScript in order to run JavaScript programs on its Internet Explorer browser while offering additional functionality that, if used, would cause pages using JScript not to run in other browsers. This divergence of functionality led to severe problems for web site developers who often needed to make different versions of a web page in order for it to run properly on the increasingly differing web browsers. Though the development of ECMAScript has effectively reduced the divergence by providing a referencing standard, it has not been able to remove the divergence completely.

JavaScript Getting Started

Adding JavaScript to a web page is actually surprisingly easy! First, to do this, you’re going to need a text editor. Unlike word processing applications like Microsoft Word, a text editor helps you deal with raw code very effectively, and the best text editor is Notepad. Load up Notepad – it’s probably in Start > Programs > Accessories. Type in the following:

Code:

1
2
3
4
5


<script language="JavaScript">

JavaScript code here...

</script>

There are multiple ways of adding JavaScript to web pages. Sometimes a script can be included as part of an HTML tag and other times as part of the <body> on the page. A script can also be placed inside the page's <head>.
If your script is going to be embedded, you will need to use the <script> tag to tell the browser not to display the code.
Try adding a script by opening a blank page and saving it as javatest.html. Follow these steps:

Type the opening tag:
<script>

Add an opening HTML comment tag just below the <script> tag:
<script>
<!—

Add the type=" “attribute to give the MIME type for the script. For JavaScript, use type="text/javascript"
<script type="text/javascript">
<!—

Add a closing HTML comment and </script> tag:

Code:

1
2
3
4


<script type="text/javascript">
<!--
-->
</script>

The example below shows how to use JavaScript to write text on a web page:

Code:

1
2
3
4
5
6
7


<html>
<body>
<script type="text/javascript">
document.write("Testing a JavaScript script");

</script></body>
</html>

Save the file as filename.html and display it in your browser. You should see the text "Testing a JavaScript script" displayed in your browser.

The example below shows how to add HTML tags to the JavaScript:

Code:

1
2
3
4
5
6
7


<html>
<body>
<script type="text/javascript">
document.write("<strong>Testing a JavaScript script</strong>");

</script>
</body>
</html>

Case sensitivity in JavaScript

JavaScript is a case-sensitive scripting language. What that means is that the language considers capital letters as different from their lowercase counterparts. For example, if you declare a variable called totalCost in JavaScript, you have to use totalCost to refer to that variable not TotalCost, TOTALCOST, or some other combination.

In JavaScript the case sensitivity does not just apply to variable names but also to JavaScript keywords, event handlers, and object properties or methods. Keywords in JavaScript are all lowercase, for example, while, for, if, else, and so on. On the other hand, methods (properties) use "camel-back" naming convention (first word is in lowercase and each successive first letter of each word is capitalized), for example, toArray(), lastModified(), and so on.

Whitespace in JavaScript

A whitespace character is an empty space (without any visual representation) on screen. Examples of whitespace characters include space characters, tabs, and line break characters. In JavaScript, use of excessive whitespace is ignored. For instance, the following JavaScript code,
a = b * d - c;

is equivalent to
a = b * d - c;

Search in select list

2010-05-01 17:05:35 750day


<HTML><HEAD><SCRIPT type="text/javascript">

function searchSel() {

  var input=document.getElementById('realtxt').value.toLowerCase();

  var output=document.getElementById('realitems').options;

  for(var i=0;i<output.length;i++) {

    if(output[i].value.indexOf(input)==0){

      output[i].selected=true;

      }

    if(document.forms[0].realtxt.value==''){

      output[0].selected=true;

      }

  }

}

</SCRIPT></HEAD><BODY>

<FORM>

Search <input type="text" id="realtxt" onkeyup="searchSel()">

<SELECT id="realitems">

<OPTION value="">Select...

<OPTION value="afghanistan">Afghanistan

<OPTION value="albania">Albania

<OPTION value="algeria">Algeria

<OPTION value="andorra">Andorra

<OPTION value="angola">Angola

</SELECT>

</FORM></BODY></HTML>

Rahul

2010-05-27 20:05:27 724day


it fabulous...

Niklank Jain

2010-04-26 12:04:52 755day


Its Very Useful post for all beginners, who can learn JS easily.

dear moderator pls do post more regarding Java Script, which we can learn more and increase our knowledge in JS.



Thanks

Nik

Tejas

2010-11-29 17:11:15 538day


Nice tutorial,i like to learn with you/.

Manoj

2011-02-14 11:02:31 461day

gr8

Jai

2011-02-09 11:02:54 466day


vrey easy understand and useful one

Gyanu

2012-03-30 11:03:43 51day


Its very easy to understandable...........

Add Comments / Scripts

Name:
E-mail:
Comment:
	Enter the code above here : Can't read the image? click here to refresh