Dom manipulation of web JavaScript

Today, I first studied the content of the previous review, and then learned that when the mouse pointer to a button, the corresponding background image switch.

<div id= "D1" >
</div>
<input type= "button" value= "1" onmouseover= "dj1 ()" id= "J1" class= "C1" style= "Background-color: #6F3"/>
<input type= "button" value= "2" onmouseover= "Dj2 ()" id= "J2" class= "C1"/>
<input type= "button" value= "3" onmouseover= "Dj3 ()" id= "J3" class= "C1"/>

　　

<script>
var A=document.getelementbyid ("J1");
var B=document.getelementbyid ("J2");
var C=document.getelementbyid ("J3");
function dj1 ()
{
var Aa=document.getelementbyid ("D1");
Aa.style.backgroundimage= "url (6upckhin3k5o0006.jpg)";
A.style.backgroundcolor= "#6F3";
B.style.backgroundcolor= "#CCC";
C.style.backgroundcolor= "#CCC";
}
function Dj2 ()
{
var Aa=document.getelementbyid ("D1");
Aa.style.backgroundimage= "url (22.jpg)";
A.style.backgroundcolor= "#CCC";
B.style.backgroundcolor= "#6F3";
C.style.backgroundcolor= "#CCC";
}
function Dj3 ()
{
var Aa=document.getelementbyid ("D1");
Aa.style.backgroundimage= "url (002-1.jpg)";
A.style.backgroundcolor= "#CCC";
B.style.backgroundcolor= "#CCC";
C.style.backgroundcolor= "#6F3";
}
</script>

Later, I learned how to manipulate content, styles, and properties using Window.document.

alert (a.innerhtml); The HTML code and text in the tag are captured.

A.setattribute ("attribute name", "attribute value"); Set a property, add or change all can;

A.getattribute ("attribute name"); Gets the value of the property;

A.removeattribute ("attribute name"); remove an attribute;

Dom manipulation of web JavaScript