Scribd
Upload
4 views3 pages

JavaScript Basics: Changing HTML Content

The document provides an introduction to JavaScript, highlighting its ability to manipulate HTML content, attributes, and styles. It includes examples demonstrating how to change element content, hide or show elements, and modify styles using JavaScript methods. Additionally, it notes the distinction between JavaScript and Java, mentioning their different origins and standards.

Uploaded by

online shop
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
4 views3 pages

JavaScript Basics: Changing HTML Content

The document provides an introduction to JavaScript, highlighting its ability to manipulate HTML content, attributes, and styles. It includes examples demonstrating how to change element content, hide or show elements, and modify styles using JavaScript methods. Additionally, it notes the distinction between JavaScript and Java, mentioning their different origins and standards.

Uploaded by

online shop
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

  HTML CSS   

 Menu  Log in

JavaScript Introduction
❮ Previous Next ❯

This page contains some examples of what JavaScript can do.

JavaScript Can Change HTML Content


One of many JavaScript HTML methods is getElementById() .

The example below "finds" an HTML element (with id="demo"), and changes the
element content (innerHTML) to "Hello JavaScript":

Example

[Link]("demo").innerHTML = "Hello JavaScript";

Try it Yourself »

JavaScript accepts both double and single quotes:

Example
 [Link]('demo').innerHTML
 HTML CSS = 'Hello JavaScript';   

Try it Yourself »

JavaScript Can Change HTML Attribute Values


In this example JavaScript changes the value of the src (source) attribute of an <img>
tag:

The Light Bulb

Turn on the light



Turn off the light

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

[Link]("demo").[Link] = "35px";
 Try
it Yourself
HTML » CSS   

JavaScript Can Hide HTML Elements


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

Example

[Link]("demo").[Link] = "none";

Try it Yourself »

JavaScript Can Show HTML Elements


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

Example

[Link]("demo").[Link] = "block";

Try it Yourself »

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.

You might also like