JAVA SCRIPT Introduction

JavaScript is the programming language of HTML and the Web.

JavaScript is easy to learn.

This tutorial will teach you JavaScript from basic to advanced.

Examples in Each Chapter


 

My First JavaScript

Click me to display Date and Time.

TRY it your self

Why Study JavaScript?
JavaScript is one of the 3 languages all web developers must learn:

1. HTML to define the content of web pages

2. CSS to specify the layout of web pages

3. JavaScript to program the behavior of web pages

This tutorial is about JavaScript, and how JavaScript works with HTML and CSS.

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

JavaScript was invented by Brendan Eich in 1995, and became an ECMA standard in 1997.
ECMA-262 is the official name of the standard. ECMAScript is the official name of the language.

You can read more about the different JavaScript versions in the chapter JS Versions.

JavaScript Can Change HTML Content

One of many JavaScript HTML methods is getElementById().

This example uses the method to “find” an HTML element (with id=”demo”) and changes the element content (innerHTML) to “Hello JavaScript”:

Example

document.getElementById("demo").innerHTML = "Hello JavaScript";

Try it Yourself »

With HTML and JavaScript you can use single or double quotes:

Example

document.getElementById('demo').innerHTML = 'Hello JavaScript';

Try it Yourself »


JavaScript Can Change HTML Styles (CSS)

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

Example

document.getElementById("demo").style.fontSize = "25px";
or
document.getElementById('demo').style.fontSize = '25px';

JavaScript accepts both double and single quotes


JavaScript Can Hide HTML Elements

Hiding HTML elements can be done by changing the display style:

Example

document.getElementById("demo").style.display = "none";
or
document.getElementById('demo').style.display = 'none';

Try it Yourself »


JavaScript Can Show HTML Elements

Showing hidden HTML elements can also be done by changing the display style:

Example

document.getElementById("demo").style.display = "block";
or
document.getElementById('demo').style.display = 'block';

Try it Yourself »

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s