DOMのいくつかの小さな例


<script type="text/javascript">
//document.getElementsByTagName();
function SearchDom(){
	//        li       
	var oli=document.getElementsByTagName("li");
	//    ,         ,            .
	alert("  :"+oli.length+"    :"+oli[0].tagName+"    li        :"+ oli[3].childNodes[0].nodeValue);
	var oul=document.getElementsByTagName("ul");
	var ol2=oul[1].getElementsByTagName("li");
	alert("  :"+ol2.length+"   :"+oli[1].tagName+"            :"+ol2[1].childNodes[0].nodeValue);
}
</script>
</head>
<body onload="SearchDom()">
<ul>     
<li>HTML</li>
<li>Javascript</li>
<li>Css</li>
</ul>
<ul>     
<li>asp.net</li>
<li>jsp</li>
<li>php</li>
</ul>
</body>
</html>



<script type="text/javascript">
//document.getElementById();
function SearchDom(){
	var myid=document.getElementById("myid");
	alert(myid.tagName+" "+myid.childNodes[0].nodeValue);
}
</script>
</head>
<body onload="SearchDom()">
<ul>     
<li>HTML</li>
<li>Javascript</li>
<li id="myid">Css</li>
</ul>
<ul>     
<li>asp.net</li>
<li>jsp</li>
<li>php</li>
</ul>
</body>
</html>





<script type="text/javascript">
/*    :       Dom             ,                */
/* DOM             ,         ,    HTML  ,  DOM              */
function MyDOMInspector(){
	var str="";
	var myList=document.getElementById("myList");
	if(myList.hasChildNodes())
		var child=myList.childNodes;
		for(var i=0;i<child.length;i++)
		str+=child[i].childNodes[0].nodeValue+"
"; //str+=child[i].tagName+"
"; //str+=child[i].nodeName+"
"; alert(str); } </script> </head> <body onload="MyDOMInspector()"> <ul id="myList"> <li> </li> <li> </li> <li> </li> <li> </li> <li> </li> <li> </li> </ul> </body> </html> <script type="text/javascript"> /* */ function property(){ var img=document.getElementsByTagName("img")[0];// DOM alert(img.getAttribute("title")); } </script> </head> <body onload="property()"> <img title=" " src="file:///D|/ /My Pictures/Sunset.jpg"/> </body> </html> <script type="text/javascript"> /* */ function createP(){ var newP=document.createElement("p"); var text=document.createTextNode(" !"); newP.appendChild(text); document.body.appendChild(newP); } </script> </head> <body onload="createP()"> <p> !</p> </body> </html> <script type="text/javascript"> /*InnerHTML */ function test(){ var mydiv=document.getElementById("mydiv"); alert(mydiv.innerHTML); mydiv.innerHTML="<span> !</span>" } </script> </head> <body onload="test()"> <div id="mydiv"> ! </div> </body> </html>