Getting started with DOM

DOM

function : control HTML The content of the document

Code : Get the label of the page ( Elements ) object Element

document.getElementById (" id  value " )

By element id Get the object of the element

operation Element object :
1. Modify attribute values

<img id="light" src="./image1.jpg" >
    <script>
        // adopt id Get element object 
        var light= document.getElementById("light");
        alert(" I'm going to change the picture ");
        light.src="./image2.jpg";
    </script>

2. Modify the content of the label body
attribute :innerHTML

<h1 id="title"> The proletariat United </h1>
    <script>
        // obtain h1 Label object 
        var title = document.getElementById("title");
        alert(" I need to change the content ");
        title.innerHTML=" Long live the people's Republic ";
    </script>