最終更新:2010-01-04 (月) 11:08:48 (5218d)  

Prototype.js
Top / Prototype.js

JavaScriptで使うライブラリ

http://www.prototypejs.org/

対応ブラウザ

  • The latest version of Prototype is compatible with the following browsers:
↑

Prototype.js/オブジェクト

↑

拡張されたオブジェクト

  • Object?
  • Number?
  • Function?
  • String?
  • Array? (Enumerable?から継承)
  • document? (DOMオブジェクト?の拡張)
  • Event?
↑

追加されたオブジェクト

  • PeriodicalExecuter?
  • Prototype?
  • Enumerable?
  • ObjectRange? (Enumerable?から継承)
  • Class?
  • Ajax?
  • Ajax?
    • Ajax.Responders? (Enumerable?から継承)
    • Ajax.Base?
    • Ajax.Request?
    • Ajax.Updater? (Ajax.Request?から継承)
    • Ajax.PeriodicalUpdater? (Ajax.Base?から継承)
  • Element?
    • Element.ClassNames? (Enumerable?から継承)
  • Abstract?
    • Abstract.TimedObserver?
    • Abstract.EventObserver?
    • Abstract.Insertion?
  • Insertion?
    • Insertion.Before? (Abstract.Insertion?から継承)
    • Insertion.Top? (Abstract.Insertion?から継承)
    • Insertion.Bottom? (Abstract.Insertion?から継承)
    • Insertion.After? (Abstract.Insertion?から継承)
  • Field?
  • Form?
    • Form.Observer? (Abstract.TimedObserver?から継承)
    • Form.EventObserver? (Abstract.EventObserver? から継承)
    • Form.Element?
      • Form.Element.Serializers?
      • Form.Element.Observer? (Abstract.TimedObserver?から継承)
      • Form.Element.EventObserver? (Abstract.EventObserver? から継承)
  • Position?
↑

ショートカット 

$() //getElementByID
$F() //form
$A //input
$H //url query
$R //range
$$　//CSSのセレクタ
↑

リファレンス

↑

構文

↑

$()

$()はDOMオブジェクトを表すもので、引数にはid属性の値やDOMオブジェクトを設定する。引数は複数になってもよい。戻り値のDOMオブジェクトはPrototype.jsによる拡張が施されたものになる。

$( 'div1', 'div2', 'div3' ).invoke( 'hide' );  // $( 'div1' ).hide();
↑

$$()

$$('CSSセレクタ')はCSSセレクタに該当するDOMオブジェクト?を取得

//エレメントの指定方法

$$("tag")//タグを指定
$$("#id")//idで指定
$$(".className")//classで指定
$$("input.required")//class=requiredのinput
$$("tagName1>tagName2").html("aaa");//子のみ
$$("tagName1+tagName2").html("aaa");//tag1の直後のtag2

//?
$$("tagName1,tagName2").html("aaa");//カンマ区切りでも指定可能
$$("tagName1 tagName2").html("aaa");//スペース区切りは入れ子構造（子孫全部）
//?
$$("tagName[attribute]")
$$("tagName[attribute=value]")
$$("tagName:nth-child(expression)")//式={even,odd,2n,3n+1 etc..}
$$("tagName:empty")//
$$("tagName:not(条件)")//
$$("tagName:first-child")//
$$("tagName:last-child")//

$$("tagName:enabled")//
$$("tagName:disabled")//
$$("tagName:checked")//


$$("div.about").html("aaa");//tag.class
 
↑

参考




検索：