javascript 進階篇2 CSS XML學習
編輯：JavaScript基礎知識
CSS全稱是cascading style sheets，中文名字叫級聯樣式單，也叫層疊樣式表。它的好處就是能讓代碼整齊，並且可以批量處理一些樣式。
基本語法：
注釋符：/* */
選擇符：selector {attribute:value} 同一個屬性的值用空格符號隔開，不同屬性用分號隔開。 區分大小寫。
比如要給頁面中的table定制樣式，則寫table {.....;.....;}
選擇符的使用方法有很多種，於是我又一次懶得打，從網上抄來的：
選擇符模式 說明 * 匹配任意元素。(通用選擇器) E 匹配任意元素 E (例如一個類型為 E 的元素)。(類型選擇器) E F 匹配元素 E 的任意後代元素 F 。(後代選擇器) E > F 匹配元素 E 的任意子元素 F 。(子選擇器) E:first-child 當元素 E 是它的父元素中的第一個子元素時，匹配元素 E 。(:first-child 偽類) E:link E:visited 如果 E 是一個目標還沒有訪問過(:link)或者已經訪問過(:visited)的超鏈接的源錨點時匹配元素 E 。(link 偽類) E:active E:hover E:focus 在確定的用戶動作中匹配 E 。(動態偽類) E:lang(c) 如果類型為 E 的元素使用了(人類)語言 c (文檔語言確定語言是如何被確定的)，則匹配該元素。(:lang() 偽類) E + F 如果一個元素 E 直接在元素 F 之前，則匹配元素 F 。(臨近選擇器) E[attr] 匹配具有”attr”屬性集(不考慮它的值)的任意元素 E 。(屬性選擇器) E[attr="warning"] 匹配其“attr”屬性值嚴格等於“warning”的任意元素 E 。(屬性選擇器) E[attr~="warning"] 匹配其“attr”屬性值為空格分隔的值列表，並且其中一個嚴格等於“warning”的任意元素 E 。(屬性選擇器) E[lang|="en"] 匹配其“lang”屬性具有以“en”開頭(從左邊)的值的列表的任意元素 E 。(屬性選擇器) DIV.warning 僅 HTML。用法同 DIV[class~="warning"]。(類選擇器) E#myid 匹配 ID 等於“myid”的任意元素 E 。(ID 選擇器)用到的時候再詳細解釋吧。
CSS優先級：同一個頁面或者css文件裡，有時候會對同一個元素有多個定義，這就需要根據優先級來渲染了。優先級分為 外部定義樣式的優先級與其他樣式的優先級。
外部定義樣式的優先級：具體怎麼算法就不說了，這裡單純說結果：id選擇符>類選擇符>屬性選擇符>偽類選擇符>元素選擇符>偽元素選擇符>全局選擇符>其他
其他樣式定義的優先級：文內樣式，也就是在元素裡面的style=...，這個是最最高級的，優先於所有的外部定義樣式。"!important" 這個在不同版本用法有偏差，也就不具體說了，需要的時候查吧。通過繼承得到的樣式：這個是優先級最低的樣式。
CSS屬性：請參考http://www.jb51.net/w3school/css/css_reference.htm (喂這也太不負責了吧！摔)
CSS單位: http://www.jb51.net/w3school/css/css_units.htm (博主你簡直就是個廢柴啊！摔！)
(假裝沒聽見)
下面來進入應用環節 (￣︶￣)
1.當前頁面嵌入css樣式：
復制代碼 代碼如下:
<html>
<head>
<title>css test</title>
<style>
.tableStyle{
background:yellow;
font-size:14px;
font-weight:bold;
}
</style>
</head>
<body>
<table width="400" align="center" class="tableStyle">
<tr>
<td>title:</td>
<td><input type="text" name="title" size="50"></td>
</tr>
<tr>
<td>content:</td>
<td><textarea name="content" class="userData" cols="45" rows="10"></textarea></td>
</tr>
</table>
<body>
2.嵌入css樣式文件：
我們在工程下新建一個css文件夾，然後新建一個css文件，取名為style.css。這樣做是為了代碼能整齊，當然因為這裡只是個例子於是裡面的內容我只寫了剛才例子裡的東西。
復制代碼 代碼如下:
.tableStyle{
background:yellow;
font-size:14px;
font-weight:bold;
border:1px solid #000000
引用的時候也很容易，只需要加一行：
<link rel="stylesheet" type="text/css" href="css/style.css" />
rel指定加入的是css樣式表文件，type指定文件類型，href則是文件的物理地址。
3 動態修改css樣式。
終於，跟js扯上關系了。
這個修改的方法無外乎取到元素然後修改屬性。要提的一點是，link的屬性也可以修改。
比如：寫一個link的id是myStyle，然後修改它的導入文件，方法是這樣的：
復制代碼 代碼如下:
<link rel="stylesheet" id="myStyle" type="text/css" href="css/style.css">
<script tyle="text/javascript">
//在javascript中修改時：
var styleObj=document.getElementById("myStyle");
styleObj.styleSheet.cssText="";//清除原有樣式
styleObj.styleSheet.addImport("css/style2");
</script>
好的接下來開始XML部分
（博主你的節操呢？！！）
xml如果真要詳細學可以再開一個系列了。。於是，我們這裡就是簡約的說一下。
xml的全稱是：extensible markup language，它的存在時為了更好的，更靈活而廣泛的描述數據。他的標簽幾乎全部可以由用戶定義。
比如我們要存儲一個關於書的信息，可以有不同的存儲方式：
復制代碼 代碼如下:
<book>
<name>.....</name>
<author>....</author>
<publisher>...</publisher>
</book>
<!-- or -->
<book>
<property name="name" value="....."/>
<property name="author" value="..."/>
<property name="publisher" value="...."/>.
</book>
xml還有幾個死的規定：
必須有聲明語句<?xml cersion="1.0"?> 當然裡面可以有別的比如encoding之類的屬性。
所有的xml以外的元素都必須是封閉的，也就是必須要有/>
屬性值必須包含在引號裡。
區分大小寫
標記名字以字母。“_”，“:”開頭，後面可以跟字母，數字，句點，冒號，下劃線。
只有一個根節點。
XPath
XPath是用來在XML文件中查找信息並且定位的語言。它可以遍歷樹中的元素和屬性。
數是什麼大家都懂的，其實說到這裡也就是講講xpath的語法而已。
關於xpath的語法請看http://www.jb51.net/w3school/xpath/xpath_syntax.htm
請大致浏覽上述網頁的“XPath 語法” “XPath 軸” “XPath 運算符” 以及參考手冊一欄下的“XPath 函數”。
大致浏覽過後，就可以開始這部分的練習了：
首先給一個xml文件：
復制代碼 代碼如下:
<!-- Copyright w3school.com.cn -->
<!-- W3School.com.cn bookstore example -->
<bookstore>
<book category="children">
<title lang="en">Harry Potter</title>
<author>J K. Rowling</author>
<year>2005</year>
<price>29.99</price>
</book>
<book category="cooking">
<title lang="en">Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>
<book category="web" cover="paperback">
<title lang="en">Learning XML</title>
<author>Erik T. Ray</author>
<year>2003</year>
<price>39.95</price>
</book>
<book category="web">
<title lang="en">XQuery Kick Start</title>
<author>James McGovern</author>
<author>Per Bothner</author>
<author>Kurt Cagle</author>
<author>James Linn</author>
<author>Vaidyanathan Nagarajan</author>
<year>2003</year>
<price>49.99</price>
</book>
</bookstore>
（從網站copy來的，復制請保留權限。）
在IE和FF中的使用稍有不同，這點比較麻煩，先來IE的：這段代碼中再次重申：script寫在table後面，否則它在編譯js的時候，不知道那句innerText該往哪裡加載，因為還沒有渲染到table的地方。完整代碼如下做參考：
XML in IE
復制代碼 代碼如下:
<html>
<head>
<title>xml test</title>
</head>
<body>
<table width="400" border="1px" align="center">
<tr>
<td width="30%">book name:</td>
<td><span id="bname"></span></td>
</tr>
<tr>
<td>book author:</td>
<td ><span id="bauthor"><span></td>
</tr>
</table>
<script type="text/javascript">
<!--
var xmldoc=new ActiveXObject("MSXML2.DOMDocument.3.0");
xmldoc.load("xml/books.xml");
var name=xmldoc.selectNodes("/bookstore/book/title");
var author=xmldoc.selectNodes("/bookstore/book/author");
var bname=document.getElementById("bname");
var bauthor=document.getElementById("bauthor");
bname.innerText=name[0].text;
bauthor.innerHTML="<p>"+author[0].text+"</p>";
//-->
</script>
<body>
</html>
接下來是FF的：
復制代碼 代碼如下:
<html>
<head>
<title>xml test</title>
</head>
<body>
<table width="400" border="1px" align="center">
<tr>
<td width="30%">book name:</td>
<td><span id="bname"></span></td>
</tr>
<tr>
<td>book author:</td>
<td ><span id="bauthor"><span></td>
</tr>
</table>
<script type="text/javascript">
<!--
var xmldoc=document.implementation.createDocument("","",null);
xmldoc.load("xml/books.xml")
//xmlDoc.evaluate(xpath, xmlDoc, namespace, XPathResult.ANY_TYPE,XPahrResult);
var evaluatorObj=new XPathEvaluator();
function getBookChild(path){
return evaluatorObj.evaluate(path,xmldoc.documentElement,null,
XPathResult.ORDERED_NODE_ITERATOR_TYPE,null);
}
var namelist=getBookChild("/bookstore/book/title");
var name=namelist.iterateNext();
var authorlist=getBookChild("/bookstore/book/author");
var author=authorlist.iterateNext();
var bname=document.getElementById("bname");
var bauthor=document.getElementById("bauthor");
bname.innerHTML=name.childNodes[0].nodeValue;
bauthor.innerHTML=author.childNodes[0].nodeValue
//-->
</script>
<body>
</html>
xml在FF中的讀取網上的資源很少，我找了好多也沒找到可以讀到結點值的，於是我用debug在ff浏覽器下觀察了好久，終於找到了 author.childNodes[0].nodeValue 這一句。
XML文件在firefox浏覽器下的讀取主要有兩個類實現，一個是XPathEvaluator, XPathResult。其實就是用XPathEvaluator查找，然後在XPathResult裡存儲查找結果。可以看到我的代碼裡用XPathEvaluator查找的部分，那個函數evaluate的參數非常多，但是必須要了解這個函數才行，摘取下別人的東西（原內容點這裡）：
函數：evaluate(xpathText,contextNode,namespaceURLMapper,resultType,result)
參數
描述
xpathText
表示要計算的 XPath 表達式的字符串。
contextNode
文檔中，對應要計算的表達式的節點。
namespaceURLMapper
返回類型 說明 ANY_TYPE 把這個值傳遞給 Document.evaluate() 或 XPathExpression.evaluate() 來指定可接受的結果類型。屬性 resultType 並不設置這個值。 NUMBER_TYPE numbervalue 保存結果。 STRING_TYPE stringvalue 保存結果。 BOOLEAN_TYPE booleanValue 保存結果。 UNORDERED_NODE_ITERATOR_TYPE 這個結果是節點的無序集合，可以通過重復調用 iterateNext() 直到返回 null 來依次訪問。在此迭代過程中，文檔必須不被修改。 ORDERED_NODE_ITERATOR_TYPE 結果是節點的列表，按照文檔中的屬性排列，可以通過重復調用 iterateNext() 直到返回 null 來依次訪問。在此迭代過程中，文檔必須不被修改。 UNORDERED_NODE_SNAPSHOT_TYPE 結果是一個隨機訪問的節點列表。snapshotLength 屬性指定了列表的長度，並且 snapshotItem() 方法返回指定下標的節點。節點可能和它們出現在文檔中的順序不一樣。既然這種結果是一個“快照”，因此即便文檔發生變化，它也有效。 ORDERED_NODE_SNAPSHOT_TYPE 這個結果是一個隨機訪問的節點列表，就像 UNORDERED_NODE_SNAPSHOT_TYPE，只不過這個列表是按照文檔中的順序排列的。 ANY_UNORDERED_NODE_TYPE singleNodeValue 屬性引用和查詢匹配的一個節點，如果沒有匹配的節點則為 null。如果有多個節點和查詢匹配，singleNodeValue 可能是任何一個匹配節點。 FIRST_ORDERED_NODE_TYPE singleNodeValue 保存了文檔中的第一個和查詢匹配的節點，如果沒有匹配的節點，則為 null。(雖然是抄的，可是復制神馬的也很辛苦的=w=)
除了這些之外，xml文件結點其實還可以增加條件，比如只要第一個符合條件的結點：
/bookstore/book[1]/title
或者價格高於35的：
/bookstore/book[price>35]/price
之前的例子裡不用條件選取是我想示范一下返回所有子結點的效果，畢竟這才是常用的。
這裡提到一個概念叫做XSLT，這是一個用來轉換xml文件的語言，全稱是：extensible stylesheet language transformation。XSLT借用XPath在xml文檔中尋找信息，它可以將xml文件中存放的內容按照指定樣式顯示為html頁面。
具體有興趣的同學可以查查看，反正我是沒興趣。。╮(╯▽╰)╭
終於，到了xml的最後一個概念：數據島
其實就是指頁面包含了xml數據信息，跟css一樣，可以內部鑲嵌，辦法就是<xml>......</xml> 也可以外部引入：<xml src="xml/books.xml"></xml>
xml數據島的數據與html標簽的綁定，通過datasrc, datafld來完成，但是我試來試去也沒有一個代碼能運行，於是就暫時這樣吧，等我把代碼弄好再回來補充好了。
基本語法：
注釋符：/* */
選擇符：selector {attribute:value} 同一個屬性的值用空格符號隔開，不同屬性用分號隔開。 區分大小寫。
比如要給頁面中的table定制樣式，則寫table {.....;.....;}
選擇符的使用方法有很多種，於是我又一次懶得打，從網上抄來的：
選擇符模式 說明 * 匹配任意元素。(通用選擇器) E 匹配任意元素 E (例如一個類型為 E 的元素)。(類型選擇器) E F 匹配元素 E 的任意後代元素 F 。(後代選擇器) E > F 匹配元素 E 的任意子元素 F 。(子選擇器) E:first-child 當元素 E 是它的父元素中的第一個子元素時，匹配元素 E 。(:first-child 偽類) E:link E:visited 如果 E 是一個目標還沒有訪問過(:link)或者已經訪問過(:visited)的超鏈接的源錨點時匹配元素 E 。(link 偽類) E:active E:hover E:focus 在確定的用戶動作中匹配 E 。(動態偽類) E:lang(c) 如果類型為 E 的元素使用了(人類)語言 c (文檔語言確定語言是如何被確定的)，則匹配該元素。(:lang() 偽類) E + F 如果一個元素 E 直接在元素 F 之前，則匹配元素 F 。(臨近選擇器) E[attr] 匹配具有”attr”屬性集(不考慮它的值)的任意元素 E 。(屬性選擇器) E[attr="warning"] 匹配其“attr”屬性值嚴格等於“warning”的任意元素 E 。(屬性選擇器) E[attr~="warning"] 匹配其“attr”屬性值為空格分隔的值列表，並且其中一個嚴格等於“warning”的任意元素 E 。(屬性選擇器) E[lang|="en"] 匹配其“lang”屬性具有以“en”開頭(從左邊)的值的列表的任意元素 E 。(屬性選擇器) DIV.warning 僅 HTML。用法同 DIV[class~="warning"]。(類選擇器) E#myid 匹配 ID 等於“myid”的任意元素 E 。(ID 選擇器)用到的時候再詳細解釋吧。
CSS優先級：同一個頁面或者css文件裡，有時候會對同一個元素有多個定義，這就需要根據優先級來渲染了。優先級分為 外部定義樣式的優先級與其他樣式的優先級。
外部定義樣式的優先級：具體怎麼算法就不說了，這裡單純說結果：id選擇符>類選擇符>屬性選擇符>偽類選擇符>元素選擇符>偽元素選擇符>全局選擇符>其他
其他樣式定義的優先級：文內樣式，也就是在元素裡面的style=...，這個是最最高級的，優先於所有的外部定義樣式。"!important" 這個在不同版本用法有偏差，也就不具體說了，需要的時候查吧。通過繼承得到的樣式：這個是優先級最低的樣式。
CSS屬性：請參考http://www.jb51.net/w3school/css/css_reference.htm (喂這也太不負責了吧！摔)
CSS單位: http://www.jb51.net/w3school/css/css_units.htm (博主你簡直就是個廢柴啊！摔！)
(假裝沒聽見)
下面來進入應用環節 (￣︶￣)
1.當前頁面嵌入css樣式：
復制代碼 代碼如下:
<html>
<head>
<title>css test</title>
<style>
.tableStyle{
background:yellow;
font-size:14px;
font-weight:bold;
}
</style>
</head>
<body>
<table width="400" align="center" class="tableStyle">
<tr>
<td>title:</td>
<td><input type="text" name="title" size="50"></td>
</tr>
<tr>
<td>content:</td>
<td><textarea name="content" class="userData" cols="45" rows="10"></textarea></td>
</tr>
</table>
<body>
2.嵌入css樣式文件：
我們在工程下新建一個css文件夾，然後新建一個css文件，取名為style.css。這樣做是為了代碼能整齊，當然因為這裡只是個例子於是裡面的內容我只寫了剛才例子裡的東西。
復制代碼 代碼如下:
.tableStyle{
background:yellow;
font-size:14px;
font-weight:bold;
border:1px solid #000000
引用的時候也很容易，只需要加一行：
<link rel="stylesheet" type="text/css" href="css/style.css" />
rel指定加入的是css樣式表文件，type指定文件類型，href則是文件的物理地址。
3 動態修改css樣式。
終於，跟js扯上關系了。
這個修改的方法無外乎取到元素然後修改屬性。要提的一點是，link的屬性也可以修改。
比如：寫一個link的id是myStyle，然後修改它的導入文件，方法是這樣的：
復制代碼 代碼如下:
<link rel="stylesheet" id="myStyle" type="text/css" href="css/style.css">
<script tyle="text/javascript">
//在javascript中修改時：
var styleObj=document.getElementById("myStyle");
styleObj.styleSheet.cssText="";//清除原有樣式
styleObj.styleSheet.addImport("css/style2");
</script>
好的接下來開始XML部分
（博主你的節操呢？！！）
xml如果真要詳細學可以再開一個系列了。。於是，我們這裡就是簡約的說一下。
xml的全稱是：extensible markup language，它的存在時為了更好的，更靈活而廣泛的描述數據。他的標簽幾乎全部可以由用戶定義。
比如我們要存儲一個關於書的信息，可以有不同的存儲方式：
復制代碼 代碼如下:
<book>
<name>.....</name>
<author>....</author>
<publisher>...</publisher>
</book>
<!-- or -->
<book>
<property name="name" value="....."/>
<property name="author" value="..."/>
<property name="publisher" value="...."/>.
</book>
xml還有幾個死的規定：
必須有聲明語句<?xml cersion="1.0"?> 當然裡面可以有別的比如encoding之類的屬性。
所有的xml以外的元素都必須是封閉的，也就是必須要有/>
屬性值必須包含在引號裡。
區分大小寫
標記名字以字母。“_”，“:”開頭，後面可以跟字母，數字，句點，冒號，下劃線。
只有一個根節點。
XPath
XPath是用來在XML文件中查找信息並且定位的語言。它可以遍歷樹中的元素和屬性。
數是什麼大家都懂的，其實說到這裡也就是講講xpath的語法而已。
關於xpath的語法請看http://www.jb51.net/w3school/xpath/xpath_syntax.htm
請大致浏覽上述網頁的“XPath 語法” “XPath 軸” “XPath 運算符” 以及參考手冊一欄下的“XPath 函數”。
大致浏覽過後，就可以開始這部分的練習了：
首先給一個xml文件：
復制代碼 代碼如下:
<!-- Copyright w3school.com.cn -->
<!-- W3School.com.cn bookstore example -->
<bookstore>
<book category="children">
<title lang="en">Harry Potter</title>
<author>J K. Rowling</author>
<year>2005</year>
<price>29.99</price>
</book>
<book category="cooking">
<title lang="en">Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>
<book category="web" cover="paperback">
<title lang="en">Learning XML</title>
<author>Erik T. Ray</author>
<year>2003</year>
<price>39.95</price>
</book>
<book category="web">
<title lang="en">XQuery Kick Start</title>
<author>James McGovern</author>
<author>Per Bothner</author>
<author>Kurt Cagle</author>
<author>James Linn</author>
<author>Vaidyanathan Nagarajan</author>
<year>2003</year>
<price>49.99</price>
</book>
</bookstore>
（從網站copy來的，復制請保留權限。）
在IE和FF中的使用稍有不同，這點比較麻煩，先來IE的：這段代碼中再次重申：script寫在table後面，否則它在編譯js的時候，不知道那句innerText該往哪裡加載，因為還沒有渲染到table的地方。完整代碼如下做參考：
XML in IE
復制代碼 代碼如下:
<html>
<head>
<title>xml test</title>
</head>
<body>
<table width="400" border="1px" align="center">
<tr>
<td width="30%">book name:</td>
<td><span id="bname"></span></td>
</tr>
<tr>
<td>book author:</td>
<td ><span id="bauthor"><span></td>
</tr>
</table>
<script type="text/javascript">
<!--
var xmldoc=new ActiveXObject("MSXML2.DOMDocument.3.0");
xmldoc.load("xml/books.xml");
var name=xmldoc.selectNodes("/bookstore/book/title");
var author=xmldoc.selectNodes("/bookstore/book/author");
var bname=document.getElementById("bname");
var bauthor=document.getElementById("bauthor");
bname.innerText=name[0].text;
bauthor.innerHTML="<p>"+author[0].text+"</p>";
//-->
</script>
<body>
</html>
接下來是FF的：
復制代碼 代碼如下:
<html>
<head>
<title>xml test</title>
</head>
<body>
<table width="400" border="1px" align="center">
<tr>
<td width="30%">book name:</td>
<td><span id="bname"></span></td>
</tr>
<tr>
<td>book author:</td>
<td ><span id="bauthor"><span></td>
</tr>
</table>
<script type="text/javascript">
<!--
var xmldoc=document.implementation.createDocument("","",null);
xmldoc.load("xml/books.xml")
//xmlDoc.evaluate(xpath, xmlDoc, namespace, XPathResult.ANY_TYPE,XPahrResult);
var evaluatorObj=new XPathEvaluator();
function getBookChild(path){
return evaluatorObj.evaluate(path,xmldoc.documentElement,null,
XPathResult.ORDERED_NODE_ITERATOR_TYPE,null);
}
var namelist=getBookChild("/bookstore/book/title");
var name=namelist.iterateNext();
var authorlist=getBookChild("/bookstore/book/author");
var author=authorlist.iterateNext();
var bname=document.getElementById("bname");
var bauthor=document.getElementById("bauthor");
bname.innerHTML=name.childNodes[0].nodeValue;
bauthor.innerHTML=author.childNodes[0].nodeValue
//-->
</script>
<body>
</html>
xml在FF中的讀取網上的資源很少，我找了好多也沒找到可以讀到結點值的，於是我用debug在ff浏覽器下觀察了好久，終於找到了 author.childNodes[0].nodeValue 這一句。
XML文件在firefox浏覽器下的讀取主要有兩個類實現，一個是XPathEvaluator, XPathResult。其實就是用XPathEvaluator查找，然後在XPathResult裡存儲查找結果。可以看到我的代碼裡用XPathEvaluator查找的部分，那個函數evaluate的參數非常多，但是必須要了解這個函數才行，摘取下別人的東西（原內容點這裡）：
函數：evaluate(xpathText,contextNode,namespaceURLMapper,resultType,result)
把一個命名空間前綴映射為一個全稱命名空間 URL 的函數。
如果不需要這樣的映射，就為 null。
resultType指定了期待作為結果的對象的類型，使用 XPath 轉換來強制結果類型。
類型的可能的值是 XPathResult 對象所定義的常量。
result一個復用的 XPathResult 對象；
如果你要創建一個新的 XPathResult 對象，則為 null。
注意，resultTypt有很多種參數值，繼續抄來：返回類型 說明 ANY_TYPE 把這個值傳遞給 Document.evaluate() 或 XPathExpression.evaluate() 來指定可接受的結果類型。屬性 resultType 並不設置這個值。 NUMBER_TYPE numbervalue 保存結果。 STRING_TYPE stringvalue 保存結果。 BOOLEAN_TYPE booleanValue 保存結果。 UNORDERED_NODE_ITERATOR_TYPE 這個結果是節點的無序集合，可以通過重復調用 iterateNext() 直到返回 null 來依次訪問。在此迭代過程中，文檔必須不被修改。 ORDERED_NODE_ITERATOR_TYPE 結果是節點的列表，按照文檔中的屬性排列，可以通過重復調用 iterateNext() 直到返回 null 來依次訪問。在此迭代過程中，文檔必須不被修改。 UNORDERED_NODE_SNAPSHOT_TYPE 結果是一個隨機訪問的節點列表。snapshotLength 屬性指定了列表的長度，並且 snapshotItem() 方法返回指定下標的節點。節點可能和它們出現在文檔中的順序不一樣。既然這種結果是一個“快照”，因此即便文檔發生變化，它也有效。 ORDERED_NODE_SNAPSHOT_TYPE 這個結果是一個隨機訪問的節點列表，就像 UNORDERED_NODE_SNAPSHOT_TYPE，只不過這個列表是按照文檔中的順序排列的。 ANY_UNORDERED_NODE_TYPE singleNodeValue 屬性引用和查詢匹配的一個節點，如果沒有匹配的節點則為 null。如果有多個節點和查詢匹配，singleNodeValue 可能是任何一個匹配節點。 FIRST_ORDERED_NODE_TYPE singleNodeValue 保存了文檔中的第一個和查詢匹配的節點，如果沒有匹配的節點，則為 null。(雖然是抄的，可是復制神馬的也很辛苦的=w=)
除了這些之外，xml文件結點其實還可以增加條件，比如只要第一個符合條件的結點：
/bookstore/book[1]/title
或者價格高於35的：
/bookstore/book[price>35]/price
之前的例子裡不用條件選取是我想示范一下返回所有子結點的效果，畢竟這才是常用的。
這裡提到一個概念叫做XSLT，這是一個用來轉換xml文件的語言，全稱是：extensible stylesheet language transformation。XSLT借用XPath在xml文檔中尋找信息，它可以將xml文件中存放的內容按照指定樣式顯示為html頁面。
具體有興趣的同學可以查查看，反正我是沒興趣。。╮(╯▽╰)╭
終於，到了xml的最後一個概念：數據島
其實就是指頁面包含了xml數據信息，跟css一樣，可以內部鑲嵌，辦法就是<xml>......</xml> 也可以外部引入：<xml src="xml/books.xml"></xml>
xml數據島的數據與html標簽的綁定，通過datasrc, datafld來完成，但是我試來試去也沒有一個代碼能運行，於是就暫時這樣吧，等我把代碼弄好再回來補充好了。
小編推薦
熱門推薦