• Related Post

    Friday, January 19, 2018

    JavaScript Introduction, JavaScript Tutorial, Change html element with JavaScript


    Java Script Introduction

    java script is a programming language of HTML and web, if you really want to learn then java script is really easy to learn. Always keep in your mind that javasctip and java both are not same language. Both are very different in concept and in design.

    What to Study with Java Script

    java script basically set of 3 language and all developer sould have knowledge HTML and CSS. HTML help you to design the content of your web page. And CSS help you to make layout of your webpage and finally java script help you to behavior of your web pages.

    Java Script to Change HTML Content

    getElementById() is the one of many java script element. You will understnad better by following example.

    Example:- 

    <p id="demo">Java Sctipt to change html element</p>
    <button type="button" onclick='document.getElementById("demo").innerHTML = "Hello This is inner content"'>Click Me!</button>

    In this example first of all we had a <p> html element and we given a id name "demo" and write some content. If you want to change your <p> element content on button click then you can by this example.

    Change Font Size with Java Script

    If you want you can change html style with java script. In following example i will show you how to change font style.

    Example:- 

    <p id="demo">Chnage Font Style with java script</p>
    <button type="button" onclick="document.getElementById('demo').style.fontSize='30px'">Click</button>

    You can see we have normal font style inside <p> element when you will click on button font size will be 30px.

    Hide HTML element in Java Script

    You can hide your html element with JavaScript by adding .style.display='none'.

    Example:- 

    <p id="demo">Hide HTML Element</p>
    <button type="button" onclick="document.getElementById('demo').style.display='none'">Click</button>

    No comments:

    Post a Comment