Java Script Introduction:-

In this, we will learn what JavaScript can do.


Java Script Can Change HTML Content:-

One of many Javascript HTML methods is getElementById( ).

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



<!DOCTYPE html>

<html>

<body>

<h1> What JavaScript Can Do?</h1>

<p id="demo"> JavaScript can change HTML content.</p>

<button type="button" onclick="document.getElementById("demo").innerHTML = Hello JavaScript !" '> Click Me!</button>

</body>

</html>

Try this code for a better experience 



JavaScript accepts both single and double quotes:



<!DOCTYPE html>

<html>

<body>

<h1> What JavaScript Can Do?</h1>

<p id="demo"> JavaScript can change HTML content.</p>

<button type="button" onclick='document.getElementById('demo').innerHTML = Hello JavaScript !' "> Click Me!</button>

</body>

</html>

Try this code for a better experience 



JavaScript Can Change HTML Attribute Values:-

In this, we will see how JavaScript changes the value of the src (source) attribute of a <img> tag.



<!DOCTYPE html>

<html>

<body>

<h1>What JavaScript Can Do?</h1>

<p> JavaScript can change the HTML attribute values.</p>

<button onclick=" document.getElementById( 'myImage' ).src=' !--here use any bulbon png--! pic_bulbon.gif ' "> Turn on the light </button>

<img id="myImage" src="pic_bulboff.gif" style="width:100px">

<button onclick=" document.getElementById( 'myImage' ).src=' !--here use any bulboff png--! pic_bulbon.gif ' "> Turn off the light </button>

</body>

</html>

Try this code for a better experience 



JavaScript Can Change The HTML Style(CSS):-

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



<!DOCTYPE html>

<html>

<body>

<h1> What JavaScript Can Do?</h1>

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

<button type="button" onclick=" document.getElementById( 'demo' ).style.fonsize='35px' " Click Me! </button>

</body>

</html>

Try this code for a better experience