JavaScript in HTML5

The <script> tag is used to define a client-side script, such as a JavaScript.

The <script> element either contains scripting 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.

<p id="function"></p>
    <script>
document.getElementById("function").innerHTML = "Welcome To JavaScript!";
    </script>

In the above code snippet we have defined the Usage of Javascript in HTML, The given   <p> tag with id as function and script tag with predefined function as document.getElementByID as function with the value as Welcome to javascript, we have given the id function to the <p> tag to call the function of the javascript 

output

Javascript with the buttons

We can use the javascript functions to the HTML buttons

 <h1>HTML Javascript</h1>

    <p>Click on the button to open the Text</p>

    <button type="button" onclick="myJava()">Click Me!</button>

    <p id="demo"></p>

    <script>
        function myJava() {
            document.getElementById("demo").innerHTML = "Welcome To JavaScript!";
        }
    </script>

Javascript with Buttons 

• In the above code snippet we have defined the Javascript linking to the buttons
• <button type/> - button with onclick as my java and id as demo,
• In the script function we are having the function as my java to define the function with id as demo with the value as Welcome to javascript, if we click the buttons the text box opens

output

Javascript with the style attribute

We can the style of the html elements using javascript

<h1>TechFunda</h1>

    <p id="demo">It changes the fontsize of the text.</p>
    <script>
        function mystyle() {
            document.getElementById("demo").style.fontSize = "25px";
        }
    </script>
 <button type="button" onclick="mystyle()">Click Me!</button>

Style attributes

• In the above code snippet we have defined the changing the fontsize of the text
• The id as demo, we are having the function as mystyle with the predefined the function with the id as demo and style.fontsize is used to change the fontsize of the text
• The function as mystyle in the button element which calls the function to change the font size of the text

output