prototype.js1.5ではみんながこうしたいなーと思っていた機能が実装されました。(via Encytemedia) （SVN co http://dev.rubyonrails.org/svn/rails/spinoffs/prototype して rake distしたもの ）
■Element.Methods
1.4まではelementに対する操作は
javascript code
- Element.show($("test"));
- Element.update($("test"), "hoge");
のように書く必要がありました。
これが
javascript code
- $("test").show();
- $("test").update("hoge");
と書けるようになりました。
これはprototype.jsで最も偉大な$メソッドの変更によるモノです。
javascript code
- function $() {
- var results = [], element;
- for (var i = 0; i < arguments.length; i++) {
- element = arguments[i];
- if (typeof element == 'string')
- element = document.getElementById(element);
- results.push(Element.extend(element)); //<= ココ！
- }
- return results.length < 2 ? results[0] : results;
- }
つまり取得したelementに対してElement.extendが適応されるようになった、と。 んでそのElement.extendは
javascript code
- Element.extend = function(element) {
- if (!element) return;
- if (!element._extended && element.tagName && element != window) {
- var methods = Element.Methods;
- for (property in methods) {
- var value = methods[property];
- if (typeof value == 'function')
- element[property] = value.bind(null, element);
- }
- }
- element._extended = true;
- return element;
- }
Element.Methodsのメソッドがelementに対して第1引数をそのelementに束縛した状態でセットされます。 つまりElement.Methodsにメソッドを追加すれば自動的に$で取得したelementに対してそのメソッドが追加されます。
ちなみにscriptaculousでも
javascript code
- if(Element.Methods) {
- Element.Methods.visualEffect = function(element, effect, options) {
- s = effect.gsub(/_/, '-').camelize();
- effect_class = s.charAt(0).toUpperCase() + s.substring(1);
- new Effect[effect_class](element, options);
- return $(element);
- }
- }
というコードが追加されています。 クラス名変換のオーバーヘッドはあるものの、$("test").visualEffect('scale')と書けるようになりました。
IEで$$が動くようになっていたりと1.5のリリースが待ち遠しいですね。
No comments yet
trackback uriLeave a Comment