今天開始本系列教程的第2講。在這一講中，我們會學習幾種選擇html元素的方法。在許多方面，這是mootools用得最多最基本的。畢竟，要建立乙個基於html元素的互動性使用者體驗，你必須首先把它們掌握在手中。
$();
$函式是mootools中基本的選擇器。你可以通過它來根據乙個id選擇dom元素。
[複製**]
[儲存**]
// 選擇id為」body_wrap「的元素
$('body_wrap');
[複製**]
[儲存**]
"body_wrap">
.getelement();
.getelement();擴充套件了$方法，可以讓你簡化你的選擇操作。例如，你可以通過$方法來選擇id為」body_wrap「的元素，然後選 擇第乙個子節點。.getelement();只選擇乙個元素，如果有多個符合要求的元素則返回第乙個元素。如果你給.getelement();方法一 個css類名作為引數，你就會得到第乙個有這個css類名的元素，而不是函式所有元素的陣列。要選擇多個元素，則可以使用下面 的.getelements();方法。
[複製**]
[儲存**]
// 選擇id為」body_wrap「的元素下面的第乙個鏈結
$('body_wrap').getelement('a');
// 選擇id為」body_wrap「的元素下面的id為」special_anchor「的元素
$('body_wrap').getelement('#special_anchor');
// 選擇id為」body_wrap「的元素下面第乙個css類名為」special_anchor_class「的元素
$('body_wrap').getelement('.special_anchor_class');
[複製**]
[儲存**]
"body_wrap">
"#">anchor
"#">another anchor
"special_anchor" href="#">special anchor
"special_anchor_class" href="#">special anchor
"special_anchor_class" href="#">another special anchor
$$();
$$函式可以可以讓你快速選擇多個元素，並組成乙個陣列（一種你可以操作、獲取和以任何方式重新排序的列表）。你可以通過標籤名（如div、a、img等）、或者id或者是他們的各種組合來選擇多個元素。就像乙個讀者指出的那樣，你可以用$$做很多事情，遠遠超出我們這裡所介紹的。
[複製**]
[儲存**]
// 選擇這個頁面中的所有div
$$('div');
// 選擇id為」id_name的元素和所有的div
$$('#id_name', 'div');
[複製**]
[儲存**]
a div
"id_name">a span
.getelements();
.getelements();和.getelement();非常類似，不過它返回所有符合要求的元素，並組成乙個陣列。你可以想使用.getelement();方法那樣使用.getelements();。
[複製**]
[儲存**]
// 選擇id為」body_wrap「的元素下面的所有鏈結
$('body_wrap').getelements('a');
// 選擇id為」body_wrap「的元素下面的所有css類名為」special_anchor_class「的子元素
$('body_wrap').getelements('.special_anchor_class');
[複製**]
[儲存**]
"body_wrap">
"#">anchor
"#">another anchor
"special_anchor_class" href="#">special anchor
"special_anchor_class" href="#">another special anchor
運算子
mootools 1.2支援幾種運算子，可以讓你進一步精簡你的選擇操作。你可以在.getelements();中使用這些運算子來包含或者排除特定的結果。mootools支援4種運算子，每一種都可以用來通過名字（name）選擇乙個input元素。
[複製**]
[儲存**]
//選擇name為」phone_number「的input元素
$('body_wrap').getelements('input[name=phone_number]');
[複製**]
[儲存**]
// 選擇name以」phone「開頭的input元素
$('body_wrap').getelements('input[name^=phone]');
[複製**]
[儲存**]
// 選擇name以數字（number）結束的input元素
$('body_wrap').getelements('input[name$=number]');
[複製**]
[儲存**]
// 選擇名字不等於」address「的input元素
$('body_wrap').getelements('input[name!=address]');
[複製**]
[儲存**]
"body_wrap">
"address" type="text" />
"phone_number" type="text" />
（fdream注：input在這裡只是作為乙個例子，你同樣可以使用這種方式選擇其他元素，比如div、a等等。）
要使用運算子，你必須首先指定元素的型別（比如這裡的input），然後指定你要過濾的屬性（比如這裡的name），再加上你的 運算子，最後選擇你的過濾字串。
even（偶數選擇）
通過這個簡單的選擇器，你可以選擇序號為偶數的元素。注意：這個選擇器從0開始計數，因此第乙個元素是偶數序的。
[複製**]
[儲存**]
// 選擇序號為偶數的div
$$('div:even');
[複製**]
[儲存**]
even
odd
even
odd
odd（奇數選擇）
和even一樣，只不過它選擇序號為奇數的元素。
[複製**]
[儲存**]
// 選擇所有序號為奇數的div
$$('div:odd');
[複製**]
[儲存**]
even
odd
even
odd
.getparent();
通過.getparent();方法，你可以得到乙個元素的父元素（parent）。
[複製**]
[儲存**]
// 選擇id為」child_id「的元素的父元素
$('child_id').getparent();
[複製**]
[儲存**]
"parent_id">
"child_id">even
JS應用DOM入門 2 DOM的物件屬性
dom提供了一套屬性用於導航 訪問和更新文件內容，其中包括唯讀型別的屬性和可讀寫型別的屬性。下表是唯讀型別的屬性 dom物件屬性 返 回 值 firstchild 返回乙個物件 object 表示第乙個孩子節點 child node lastchild 返回乙個物件 object 表示最後乙個孩子節...
dom精簡教程
先來看一張簡單的文件樹 this is a sample paragraph.結果將會顯示 p 下面是一些解釋 document.documentelement gives the page s html tag.lastchild gives the body tag.firstchild giv...
DOM 精簡知識教程
dom 精簡知識教程 先來看一張簡單的文件樹 this is a sample paragraph.結果將會顯示 p 下面是一些解釋 document.documentelement gives the page s html tag.lastchild gives the body tag.fir...