Ad

what is document.getElementbyId in javascript

 HTML DOM getElementId() method.

document.getElementbyId in javascript


  what is the getElementById() method?

1] getElementById() method is returen the element .

2] getElementById() method is returns unique function.

3]  getElementById()  method is commen method is html document object mode.

4] getElementById()  method is case-sensitive string and unique document.

5] getElementById()  method is built-in method of (DOM).
 
6] getElementById()  method is quickly access element  in html.

7] getElementById()  method is  quickly modify and quickly access  element in webpage.


Syntax :-


'document.getElementById( Id)'

  •  Element ById() is parameter used an hold the ID of Element.
  • single function accept.
  • id is part of document object model(DOM)API.
  • which provide to interact with content of web pages. 


Q 1] . change style color  properti use document.getElementById(). 

  Example :-

<html>
<head>
    <title>Example Number 3</title>
    <style>
        #heading {
            color: rgb(255, 81, 0);
            font-size: 18px;
                            }

        button{
            font-size:30px;
           
        }
    </style>
</head>
<body style="background-color:rgb
(191, 191, 229);">
    <h1 id="main-heading"
style="text-align: center;">Javascript
<br>learn programming language</h1>
    <h2 style="text-align: center;">
<br>DOM getElementById()method</h2>
 
    <button onclick="changeStyle()" >
Change heading Style color</button>
    <script>
        function changeStyle() {
        var element = document.
getElementById("main-heading");
        element.style.color = "blue";
           
        }
    </script>
</body>
</html>


Output :- 

what is document.getElementbyId in javascript


Q.2]   input text square  example use document.getElementById(). 

Example:-

<html>
    <head>
        <title> Dom getElementById() method
</title>
    </head>
    <script type="text/javascript">
        function getsquare()
        {
            var number=document.
getElementById("number").value;
            alert(number*number);
       
        }
               
    </script><br><br>
    <form>
        <h2> Dom getElementById() method</h2>
        <h3>Enter No</h3>
        <input type="text" id="number"
name="number"><br><br>
        <input type="button"
style="font-size:30; color:white;
background-color:blue;" value="square"
onclick="getsquare()">

    </form>
</html>



Output :-


document.getElementbyId in javascript



Q.3] change word   properti use document.getElementById().

Example:-

<html>
    <head>
        <title>DOM</title>
<style>
    button{
            font-size:30px;
            color: blue;
           
        }

</style>
    </head>
    <body style="background-color:
rgb(253, 134, 241);">
 <h1 id="heading">learn programming language
</h1>
 <h2 style="text-align: center;"><br>
DOM getElementById()</h2><br>
 <button onclick="alterText()">Change text
</button>
 <script>
    function alterText()
    {
        var output = document.getElementById
("heading");
        output.innerHTML
="learn programming language in<br> JavaScript
function";
    }
 </script>
    </body>
</html>


Output:-


document.getElementbyId in javascript



Related Post :-

type of css

css menu design

php syntax

how to create a order form

No comments

Powered by Blogger.