Skip to main content

HTML JavaScript

JavaScript makes HTML pages more dynamic and interactive.

A Script is a small program which is used with HTML to make web pages more attractive, dynamic and interactive, such as an alert popup window on mouse click.

Currently, the most popular scripting language is JavaScript.

Example:

<!DOCTYPE html>  
<html>
<body>
<h1>JavaScript Date and Time example</h1>
<button type="button" onclick="document.getElementById('demo').innerHTML = Date()">
Click me to display Date and Time.</button>
<p id="demo"></p>
</body>
</html>

HTML <script> Tag

The HTML <script> tag is used to define a client-side script (JavaScript).

The <script> element either contains script statements, or it points to an external script file through the src attribute.

Common uses for JavaScript are image manipulation, form validation, and dynamic changes of content.

To select an HTML element, JavaScript most often uses the document.getElementById() method.

Example: This JavaScript example writes "Hello JavaScript!" into an HTML element with id="demo":

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

Examples of what JavaScript can do

Here are some examples of what JavaScript can do:

Change content

document.getElementById("myElementId").innerHTML = "Hello JavaScript!";

Change styles

document.getElementById("myElementId").style.fontSize = "25px";  
document.getElementById("myElementId").style.color = "red";
document.getElementById("myElementId").style.backgroundColor = "yellow";

Change attributes

document.getElementById("myElementId").src = "picture.gif";

The HTML <noscript> Tag

The HTML <noscript> tag defines an alternate content to be displayed to users that have disabled scripts in their browser or have a browser that doesn't support scripts:

<script>  
document.getElementById("myElementId").innerHTML = "Hello JavaScript!";
</script>
<noscript>Sorry, your browser does not support JavaScript!</noscript>