prototype.js參考

JavaScript類擴展

prototype.js 類庫實現(xiàn)強大功能的一種途徑是擴展已有的JavaScript 類。

對 Object的擴展

對Number的擴展

下面的例子用提示框顯示0-9。

<script>
function demoTimes(){
var n = 10;
n.times(function(index){
alert(index);
});
/***************************
* you could have also used:
*           (10).times( .... );
***************************/
}
</script>
<input type=button value="Test Number.times()" onclick="demoTimes()">

對 Function擴展

讓我們看看如何運用這些擴展。

<input type=checkbox id=myChk value=1> Test?
<script>
//declaring the class
var CheckboxWatcher = Class.create();
//defining the rest of the class implementation
CheckboxWatcher.prototype = {
initialize: function(chkBox, message) {
this.chkBox = $(chkBox);
this.message = message;
//assigning our method to the event

this.chkBox.onclick =
this.showMessage.bindAsEventListener(this);

},
showMessage: function(evt) {
alert(this.message + ' (' + evt.type + ')');
}
};
var watcher = new CheckboxWatcher('myChk', 'Changed');
</script>

對String的擴展

對  Array的擴展

因為array擴展于enumerable，所以所有enumberable對象的函數(shù)，array都是可以使用的，除此之外，下面的這些也是已經(jīng)實現(xiàn)了的。

document DOM擴展

Event擴展

下面代碼演示如何給window添加一個load事件處理函數(shù)。

<script>
Event.observe(window, 'load', showMessage, false);
function showMessage() {
alert('Page loaded.');
}
</script>

在prototype.js中定義新的對象和類

另一個這個程序包幫助你的地方就是提供許多既支持面向?qū)ο笤O(shè)計理念又有共通功能的許多對象。

The PeriodicalExecuter object

這個對象提供一定間隔時間上重復調(diào)用一個方法的邏輯。

The Prototype object

Prototype 沒有太重要的作用，只是聲明了該程序包的版本 。

The Enumerable object

Enumberable對象能夠已更優(yōu)雅的方式實現(xiàn)對列表樣式的結(jié)構(gòu)進行枚舉。

很多其它的對象通過擴展自Enumberable對象來得到這些有用的接口。

The Hash object

 Hash對象實現(xiàn)一種Hash結(jié)構(gòu)，也就是一個Key:Value對的集合。

Hash中的每個Item是一個有兩個元素的array，前一個是Key，后一個是Value，每個Item也有兩個不需加以說明的屬性,key和value。

The ObjectRange class

繼承自  Enumerable

用上、下邊界描述一個對象區(qū)域。

The Class object

在這個程序包中 Class 對象在聲明其他的類時候被用到 。用這個對象聲明類使得新類支持 initialize() 方法，他起構(gòu)造方法的作用。

看下面的例子

//declaring the class
var MySampleClass = Class.create();

//defining the rest of the class implmentation
MySampleClass.prototype = {

   initialize: function(message) {
this.message = message;
   },

   showMessage: function(ajaxResponse) {
      alert(this.message);
   }
};

//now, let's instantiate and use one object
var myTalker = new MySampleClass('hi there.');
myTalker.showMessage(); //displays alert

The Ajax object

這個對象被用作其他提供AJAX功能的類的根對象。 

The Ajax.Responders object

繼承自 Enumerable

這個對象維持一個在Ajax相關(guān)事件發(fā)生時將被調(diào)用的對象的列表。比如，你要設(shè)置一個全局鉤子來處理Ajax操作異常，那么你就可以使用這個對象。

The Ajax.Base class

這個類是其他在Ajax對象中定義的類的基類。

The Ajax.Request class

繼承自 Ajax.Base

封裝 AJAX 操作

The options argument object

An important part of the AJAX operations is the options argument. There's no options class per se. Any object can be passed, as long as it has the expected properties. It is common to create anonymous objects just for the AJAX calls.

The Ajax.Updater class

繼承自 Ajax.Request

當請求的url返回一段HTML而你想把它直接放置到頁面中一個特定的元素的時候被用到。 如果url的返回<script> 的塊并且想在接收到時就執(zhí)行它的時候也可以使用該對象。含有腳本的時候使用 evalScripts 選項。

The Ajax.PeriodicalUpdater class

繼承自Ajax.Base

這個類重復生成并使用 Ajax.Updater 對象來刷新頁面中的一個元素。或者執(zhí)行 Ajax.Updater 可以執(zhí)行的其它任務(wù)。更多信息參照 Ajax.Updater 參考 。

The Element object

這個對象提供在操作DOM中元素時使用的功能性方法。

The Element.ClassNames class

繼承自  Enumerable

在一個對象中表示CSS class names的集合。

The Abstract object

這個對象是這個程序包中其他類的根。它沒有任何屬性和方法。在這個對象中定義的類可以被視為傳統(tǒng)的抽象類。

The Abstract.Insertion class

這個類被用作其他提供動態(tài)內(nèi)容插入功能的類的基類，它像一個抽象類一樣被使用。

The Insertion object

這個對象是其他類似功能的根。它沒有任何屬性和方法。在這個對象中定義的類仍然可以被視為傳統(tǒng)的抽象類。

The Insertion.Before class

繼承自 Abstract.Insertion

在給定元素開始標記的前面插入HTML。

下面的代碼
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.Before('person', 'Chief '); </script>

將把 HTML 變?yōu)?/p>
<br>Hello, Chief <span id="person" style="color:red;">Wiggum. How's it going?</span>

The Insertion.Top class

繼承自 Abstract.Insertion

在給定元素第一個子節(jié)點位置插入 HTML。內(nèi)容將位于元素的開始標記的緊后面。

下面的代碼
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.Top('person', 'Mr. '); </script>

將把 HTML 變?yōu)?/p>
<br>Hello, <span id="person" style="color:red;">Mr. Wiggum. How's it going?</span>

The Insertion.Bottom class

Inherits from Abstract.Insertion

在給定元素最后一個子節(jié)點位置插入 HTML。內(nèi)容將位于元素的結(jié)束標記的緊前面。

The following code

<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.Bottom('person', " What's up?"); </script>

Will change the HTML to

<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going? What's up?</span>

The Insertion.After class

Inherits from Abstract.Insertion

在給定元素結(jié)束標記的后面插入HTML。

The following code

<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.After('person', ' Are you there?'); </script>

Will change the HTML to

<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span> Are you there?

The Field object

這個對象提供操作表單中的輸入項目的功能性方法。

The Form object

這個對象提供操作表單和他們的輸入元素的功能性方法。

The Form.Element object

這個對象提供表單對象中的可視和非可視元素的功能性方法。

The Form.Element.Serializers object

這個對象提供了內(nèi)部使用的用來協(xié)助解析出表單元素的當前值的一些有用的方法。

The Abstract.TimedObserver class

這個類是用于其它監(jiān)聽一個元素的值(或者任何類中涉及的屬性)變化的類的基類，這個類像一個抽象類一樣被使用。

子類可以被創(chuàng)建來監(jiān)聽如輸入項目值，或style屬性，或表格的行數(shù)，或者其他任何對跟蹤變化相關(guān)的東西。

子類必須實現(xiàn)這個方法來決定什么才是被監(jiān)聽的元素的當前值。

The Form.Element.Observer class

繼承自 Abstract.TimedObserver

Abstract.TimedObserver 的一個實現(xiàn)類用來監(jiān)聽表單輸入項目的值的變化。當你想監(jiān)聽一個沒有帶報告值變化事件的元素的時候使用這個類。否則的話使用 Form.Element.EventObserver 類代替。

The Form.Observer class

繼承自 Abstract.TimedObserver

Abstract.TimedObserver 的一個實現(xiàn)類用來監(jiān)聽表單中任何數(shù)據(jù)項的值的變化。當你想監(jiān)聽一個沒有帶報告值變化事件的元素的時候使用這個類。 否則的話使用類Form.EventObserver 代替。

The Abstract.EventObserver class

這個類被用作其他一些類的基類，這些類具有在一個元素的值改變事件發(fā)生的時候執(zhí)行一個回調(diào)方法這樣的功能。

類 Abstract.EventObserver 的多個對象可以綁定到一個元素上，不是一個幫其他的擦出了，而是按照他們付給元素的順序執(zhí)行這些回調(diào)方法。

單選按鈕和復選框的觸發(fā)事件是 onclick ，而文本框和下拉列表框/下拉列表框的是 onchange 。 

The Form.Element.EventObserver class

繼承自 Abstract.EventObserver

Abstract.EventObserver 的一個實現(xiàn)類，它在監(jiān)測到表單中數(shù)據(jù)項元素的值改變的相應(yīng)事件時候執(zhí)行一個回調(diào)方法。 如果元素沒有任何報告變化的事件，那么你可以使用 Form.Element.Observer 類代替。

The Form.EventObserver class

繼承自 Abstract.EventObserver

Abstract.EventObserver 的一個實現(xiàn)類，監(jiān)聽表單對象中包含的任何對象的任何變化，用元素的事件檢測值的變化。如果元素沒有任何報告變化的事件， 那么你可以使用Form.Observer 類代替。

Position 對象 (預備文檔)

這個對象提供許多和元素位置相關(guān)的方法。

http://www.cnblogs.com/thinhunan/archive/2006/04/01/DeveloperNotesForPrototype.html