JavaScript Abilities , What JS can do!

We know JavaScript can do many thing and most popular language in the world. Here I shall mention some of JS basic abilities.

Ability-1:  JS can change HTML attributesm like src attribute value of img tag.

<button onclick="document.getElementById('bulbImage').src=
'images/pic_bulbon.gif'">Light On</button>
<img id="bulbImage" src="images/pic_bulbon.gif" style=
"width:100px">
<button onclick="document.getElementById('bulbImage').src=
'images/pic_bulboff.gif'">Light Off</button>

Ability-2: JS can change HTML content.

<p id="demo2">JS can change HTML content.</p>
<button type="button" 
onclick='document.getElementById("demo2").innerHTML =
 "Okay, I am changed!"'>Click Me!</button>

Ability-3: JS accepts both double and single quotes.

<p id="demo3">JS accepts both double and single quotes.</p>
<button type="button" 
onclick="document.getElementById('demo3').innerHTML=
 'Hello Coders!'">Click Me!</button>

Ability-4: JS can change the style of an HTML element.

<p id="demo4">JS can change the style of an HTML element.</p>
<button type="button" onclick=
"document.getElementById('demo4').style.fontSize=
'40px'">Click Me!</button>
<button type="button" onclick=
"document.getElementById('demo4').style.fontSize=
'14px'">Click Me Again!</button>

Ability-5: JS can Hide HTML elements.

<p id="demo6">JS can Show HTML elements.</p>
<button type="button" onclick=
"document.getElementById('demo6').style.display=
'none'">Click Me!</button>

Ability-6: JS can show HTML elements.

<p id="demo7" style="display:none">Hello JavaScript!</p>
<button type="button" onclick=
"document.getElementById('demo7').style.display=
'block'">Click Me!</button>

Ability-7: Show and Hide

<p id="demo8" style="display:none">Hello JavaScript!</p>
<button type="button" 
onclick="document.getElementById('demo8').style.display=
'none'">Hide!</button>
<button type="button"
 onclick="document.getElementById('demo8').style.display=
'block'">Show!</button>

Let’s Study Some Theory

    • In HTML, JavaScript code must be inserted between tags.
    • Old JavaScript examples may use a type attribute: script type=text/javascript
      script type=text/javascript

      The type attribute is not required. JavaScript is the default scripting language in HTML.

    • A JavaScript function is a block of JavaScript code, that can be executed when “called” for.For example, a function can be called when an event occurs, like when the user clicks a button
    • You can place any number of scripts in an HTML document.
    • Scripts can be placed in the, or in thesection of an HTML page, or in both.
    • JavaScript accepts both double and single quotes.

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.

Complete Source Code
Happy Coding!

1 thought on “JavaScript Abilities , What JS can do!

Leave a Reply