Eddy@Joomla!

(1 位用戶參與評分, 當前平均得到 5.00 顆星星)

Javascript / Mootools / Eddy Chang / 週二, 24 二月 2009 18:15

這個教學是從網站上找到的Mootools教學中摘要下來的，算是學習的筆記。

2.Html文件格式要設為strict，有些MooTools的功能需要這樣設定在瀏覽器中才會正常運作。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

3.DomReady取代onload，這和jQuery類似。

/*
MooTools DomReady.
Two Styles.
1. Call the function directly.
2. The function is inside of anonomos function.
*/

window.addEvent('domready', myFunction);

//Or.

window.addEvent('domready', function(){
myFunction();
});

function myFunction() {
alert("The DOM is ready.");
}

4.「$」符號的用法，用來取代document.getElementById的簡短用法，或是延申（Extends）元素可以有MooTools的元件方法。jQuery或Prototype都是類似的用法。

var myElement = $('title');
myElement.set('html', "Changed!");

5.「$$」符號的用法，用來取代getElementsByClass的簡短用法，回傳值可能是一個陣列或集合。可以用來回傳一個標籤（Tag）或CSS選定的元素集合。

// Simple
$$('a'); // Returns all anchor elements in the page
$$('a', 'b'); // Returns anchor and bold tags on the page

// The Examples Below require 'Selectors' to be in your mootools file.

// Returns an array containing only the element with the id 'myElement'
$$('#myElement');
/* Returns an array of all anchor tags with the class 'myClass' 
within the DOM element with id 'myElement'*/
$$('#myElement a.myClass'); 

// Complex Example
$$('a', '#myid, #myid2, #myid3', document.getElementsByTagName('div')); 
// Returns an array of all selectors passed in, going from left to right.

評論：