zoukankan      html  css  js  c++  java
  • DOM的一些小总结

    HTML DOM的结构:可以把HTML看成一个个的节点。


    节点:


     HTML DOM对象 --  方法和属性 

     一些DOM 对象方法 


     nodeName 属性 


    nodeValue 属性 


    nodeType:节点的类型。


    <body>
    <div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
    </body>
    <script>
    var d = document.createAttribute("good");
    document.getElementById("sss").setAttributeNode(d);
    alert(document.getElementById("t").innerHTML)
    </script>
    
    •   有点懂,但还是有点不明白。
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
    	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    	<title>DOM-1</title>
    	<script>
    		window.onload = function (){
    			var oUl = document.getElementById("ul1");
    			//alert(oUl.innerHTML);
    			//alert(oUl.parentNode.parentNode.parentNode.nodeName);	//#document
    			//alert(oUl.childNodes[0].nodeName);	//#text
    			//alert(oUl.children[0].nodeValue);	//null
    			//alert(oUl.children[0].innerHTML);	//1111
    			//alert(oUl.nodeType);	//1
    			//alert(oUl.childNodes[0].nodeType);	//3
    			//alert(oUl.parentNode.parentNode.parentNode.nodeType);	//9
    			var oLi = document.createElement("li");
    
    			//oid.innerHTML = "li1";
    			oLi.innerHTML = "5555";
    			//oUl.appendChild(oLi);
    			oUl.insertBefore(oLi,oUl.children[2]);
    			//oUl.removeChild(oLi);
    			
    			//
    			//alert(oUl.getAttribute("id"));	//ul1
    			oUl.setAttribute("class","fff");	//class="fff"
    
    			var d = document.createAttribute("good");
    			d.value = "abc";
    			document.getElementById("sss").setAttributeNode(d);
    			alert(oUl.innerHTML);
    		}
    	</script>
    </head>
    <body>
    	<ul id="ul1">
    		<li>1111</li>
    		<li id="sss">2222</li>
    		<li>3333</li>
    		<li>4444</li>
    	</ul>
    </body>
    </html>
    

      

  • 相关阅读:
    10个强大的Apache开源模块
    Flume日志收集(转载)
    hbase安装配置(整合到hadoop)
    Hadoop与HBase兼容版本汇总
    关于Mysql Proxy LUA实现Mysql读写分离
    Redis发布了集群版3.0.0 beta
    Spring MVC 学习之 400 错误
    Mahout安装(Hadoop 1.2.1 版本)
    【Android】性能优化
    【Android】asynchronous http client
  • 原文地址:https://www.cnblogs.com/xy404/p/3688735.html
Copyright © 2011-2022 走看看