文件物件模型（DOM）系列三：處理元素屬性

標籤：

　　除了擷取元素的內容，擷取和設定元素的屬性值也是經常進行操作的。處理元素屬性有很多種方法，其中元素有兩個訪問和設定元素屬性的方法，即getAttribute()和setAttribute()

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="UI._default" %><!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>    <title>DOM</title>    <script src="Scripts/jquery-1.7.1.min.js"></script>   </head><body>      <div id="node">         </div>   </body></html> <script type="text/javascript">     var x = document.getElementById("node");     x.getAttribute("id");//擷取該元素節點的Id屬性的值     x.setAttribute("id", "Container");//設定該元素節點的Id屬性的值        </script> 

1、style屬性

　　DOM中的每個節點元素都有Style屬性，用來即時的改變元素的樣式。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="UI._default" %><!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>    <title>DOM</title>   </head><body>      <div id="node" style="width:100px;height:50px;background-color:yellow;">                </div>    <input type="button"  value="改變顏色" onclick="ClickBtn()"/>    </body></html> <script type="text/javascript">      function ClickBtn()     {         document.getElementById("node").style.backgroundColor = "red";     }     </script> 

　　

 

 

 

 

 

 

　　

 

文件物件模型（DOM）系列三：處理元素屬性