Elements

bindings

This section is tested and adjusted for the current Firefox implementation. Please edit only if an actual behavior differs from the described one. Please do not edit only on the basis of another XBL specification.

<!ELEMENT bindings ( binding* ) >

階層:   ルート要素
子要素: <binding>

bindings 要素は、あらゆる XBL 文書のルート要素となります。通常 XBL はデフォルトの名前空間として宣言されるべきであり (たとえ XBL 名前空間接頭辞を用いたとしても) 、バインディングで用いる他の名前空間を追加で宣言します。

bindings は0個以上の binding 要素を子要素に持ちます。各々の binding 子要素によって、他の文書中の要素へ適用する個々のバインディングを定義します。

ひとつの要素には同時にひとつの（完結した、または他のバインディングを継承した）バインディングのみを適用することができます。複数のバインディングを適用させた場合、 CSS の規則と同じように最後のものだけが実際に適用されます。

HelloWorld example:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Hello world!</title>
<style type="text/css">
p {
 -moz-binding: url(hello.xml#default);
}
#p03 {
 -moz-binding: url(hello.xml#hello2);
}
</style>
</head>
<body

  <p>Default content</p>
  <p>Default content</p>
  <p id="p03">Default content</p>

</body>
</html>

// hello.xml

<?xml version="1.0"?>
<bindings xmlns="http://www.mozilla.org/xbl"
 xmlns:html="http://www.w3.org/1999/xhtml">
  <binding id="default">
    <content><html:b>Hello world! </html:b><children/></content>
  </binding>
  <binding id="hello2">
    <content><html:b>Hello from my binding! </html:b><children/></content>
  </binding>
</bindings>

この例を表示

次: <big>bindings > binding</big> 要素

注意

Mozilla 製品の現行の安定版リリース (例えば Firefox 2) では、行や列といった table のサブ要素に対してバインディングを適用することはできません。 table 要素自体にのみバインディングを適用することができます。これは Mozilla 製品の将来的なバージョンでは修正されるでしょう。詳しい情報や回避策についてはバグ 83830 を参照してください。
XBL ファイルを含め、 XML 文書のデフォルトの文字エンコーディングは UTF-8 です。文字エンコーディングを明示的に宣言することで、デフォルトの文字エンコーディングをオーバーライドすることもできます。例: <?xml version="1.0" encoding="ISO-8859-1"?>
名前空間宣言に書かれたURIは、名前空間を一意に識別するためのあいまいな【訳注: 原文は opaque】文字列です。そのURIは必ずしも実際のスキーマ定義や名前空間に関連したリソースを指し示している必要はありません（し、実際に何もリソースが置かれていない場合が多いです）。Namespaces in XML
デフォルトの名前空間に加え、バインディングのコンテントを定義するための他の名前空間を宣言することができます。最も有用な名前空間は、 HTML/XHTML, XUL (XML User Interface Language), SVG (Scalable Vector Graphics) そして XLink です。この場合のいくぶん汎用性の高い bindings 要素中での名前空間宣言はおおよそ以下のようになるでしょう:

<bindings xmlns="http://www.mozilla.org/xbl"
 xmlns:html = "http://www.w3.org/1999/xhtml"
 xmlns:xul  = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
 xmlns:svg  = "http://www.w3.org/2000/svg"
 xmlns:xlink= "http://www.w3.org/1999/xlink">

binding

<!ENTITY % binding-content "(resources?,content?,implementation?,handlers?)">
<!ELEMENT binding %binding-content;>
<!ATTLIST binding
   id                     ID             #REQUIRED
   extends                CDATA          #IMPLIED
   display                CDATA          #IMPLIED
   inheritstyle           true           #IMPLIED
>

binding 要素は個々の XBL バインディングを定義します。 XBL バインディングは 匿名コンテント, フィールド, プロパティ, メソッド, イベントハンドラ を HTML/XML 要素へ追加することができます。

個々の XBL バインディングはスタイルシートまたはスクリプトによって要素へ適用させることができます。 (<table> の特性についてはバグ 83830 を参照)

CSS:

div {
 -moz-binding: url(myBinding.xml#default);
}

DOM:

elementReference.style.MozBinding = "url(myBinding.xml#default}";

上記の例はともに myBinding.xml ファイル中に定義された id="default" のバインディングを利用しています。

Firefox 3 以降、 data: URL を使って文中にバインディングを埋め込むことができます。

div {
  -moz-binding: url(data:text/xml;charset=utf-8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%0A%3Cbindings%20id%3D%22xbltestBindings%22%20xmlns%3D%22http%3A//www.mozilla.org/xbl%22%3E%0A%20%20%3Cbinding%20id%3D%22xbltest%22%3E%3Ccontent%3EPASS%3C/content%3E%3C/binding%3E%0A%3C/bindings%3E%0A);
}

data: URL はフラグメント識別子【訳注: #foo のようにして XML 中の特定の部分を示すもの】をサポートしていないため、代わりに埋め込まれた XML 中に見つかった最初のバインディングが使用されます。ただし、例え参照することがなくても、バインディングには ID が必要であることに注意してください。

念のため、先ほどの例で埋め込まれた XML がどのようなものかを示します:

<?xml version="1.0"?>
<bindings id="xbltestBindings" xmlns="http://www.mozilla.org/xbl">
  <binding id="xbltest"><content>PASS</content></binding>
</bindings>

CSS による宣言のみ、一連の要素に対して簡単にバインディングを適用することが可能です。 It also makes your binding partially functional if scripting is disabled. In the latter case all methods and handlers will be blocked, but the anonymous content and styling will be still used. したがって、特定の要素に対して動的にバインディングを適用する必要がある場合を除き、通常は CSS による宣言を用いるべきです。

binding 要素は resources タグ、 content タグ、 implementation タグ、 handlers タグを子要素に持つことができます。

id - id 属性は文書中で一意となる識別子です。バインディングを適用する際にこの属性を用いるため、 binding 要素に必須の属性です。
extends - extends 属性は、このバインディングの継承元バインディングの URL を特定するために用いられます (Inheritance of Implementations 参照)。 URL は特定の XBL 文書を参照します。 XBL 文書中の特定のバインディングの id を指し示すために # 表記【訳注: 原文は notation】を用いる必要があります。振る舞いは継承できますが、コンテントは継承できないことに注意してください。
display - この属性によってタグがどのように表示されるかを指定します。この属性を用いると、既存の要素のレイアウトや表示特性を有する要素を作ることができます。たとえば、 'xul:button' という値によって、ボタンのように表示される要素を作ることができます。コロンの前の部分は名前空間接頭辞ですので、 XUL 名前空間も宣言しておく必要があります。すべてのタグが固有の表示特性を持つわけではありません。以下の XUL の表示特性を利用することができます: browser, button, checkbox, description, editor, grippy, iframe, image, label, menu, menuitem, menubar, progressmeter, radio, resizer, scrollbar, scrollbox, spacer, splitter, titlebar, treechildren, treecol 。この他に、いくつかの HTML, MathML, SVG タグも利用可能です。 'display' 属性は extends 属性がセットされてないと動作しません (バグ 119389を参照)。このような場合 display 属性の値を extends 属性へセットしてください。
inheritstyle - inheritstyle 属性はバインディング先の文書中で定義されたスタイルの規則を、 XBL バインディングによって生成された匿名コンテントに対しても適用するかどうかを指定します。この属性が true であれば、文書中のスタイルは XBL によって生成された匿名コンテントにも適用されるようになります。

content

<!ELEMENT content ANY>
<!ATTLIST content
   id               ID           #IMPLIED
>

バインディングは、バインドされた要素【訳注: バインディングが適用された要素を意味し、バインディング先の文書中に存在する】内に配置する新たな要素を定義することができます。あたかもファイル中で直接コンテントを配置しているかのように画面上で表示されますが、バインドされた要素内のコンテントは匿名であり、通常の DOM からは見えません。バインドされた要素から匿名ノードへアクセスするために、 getAnonymousElementByAttribute と getAnonymousNodes 関数が利用できます。 content タグ内に配置できる唯一の XBL 要素は、 children タグです。バインディング中の <content> 要素の属性は、バインドされた要素へセットされます。

id - id 属性は文書中で一意となる識別子です。

children

<!ELEMENT children EMPTY>
<!ATTLIST children
   id               ID                           #IMPLIED
   includes         CDATA                        #IMPLIED
>

バインドされた要素内のすべての子要素が、バインディングにより生成されたコンテント中のどの場所へ配置されるかを指定します。

通常、バインドされた要素自身が子要素としてコンテントを持っていた場合、匿名コンテントは生成されなくなります。しかし、 children 要素を用いることで、 HTML/XML 要素のコンテントを、 XBL によって生成された匿名コンテントへマージすることができます。

children タグ自身が子要素にコンテントを持つ場合、それはデフォルトのコンテントとなります。もしバインドされた要素がコンテントを持っていれば、デフォルトのコンテントは無視されます。逆にもしコンテントを持っていなければ、デフォルトのコンテントが追加されます。

id - id 属性は文書中で一意となる識別子です。
includes - includes 属性は、 children 要素で指定した挿入位置へ、特定のコンテントのみを配置できるようにするために用いられます。その値はタグ名か、あるいはカンマで区切られた複数のタグ名のリストとなります。 includes 属性の値とマッチしたタグ名のコンテントのみが、その挿入位置へ配置されます。この指定は直接の子要素にのみ適用されます。例えば、<customElement><foobar>< hoge/></foobar></customElement> というXML文書片において、customElement要素に対し <binding id="customElement"><content><xul:box><children includes="hoge"/></xul:box></content></binding> というバインディング定義が適用された場合、直接の子要素であるfoobar要素はincludes属性の指定にマッチしないために配置対象から除外され、結果として、<xul:box/> の内容は空のままとなります。

implementation

<!ENTITY % implementation-content "(method|property)*">
<!ELEMENT implementation %implementation-content;>
<!ATTLIST implementation
   id               ID           #IMPLIED
   name             CDATA        #IMPLIED
   implements       CDATA        #IMPLIED
>

implementation 要素によって、バインドされた要素が保持するメソッドとプロパティの集合【訳注: 以下、「実装」と呼ぶ】を定義します。バインディングが適用されると、これらのメソッドやプロパティをバインドされた要素から直接呼び出すことができるようになります。

id - id 属性は文書中で一意となる識別子です。
name - name 属性は、個々の実装に対して名前を付与するために用いられます。この名前は後にその実装を参照するために用いられます。例えば JavaScript では、この属性の値が、その実装のために生成されたクラス名に対応します。【訳注: 原文: For example, in JavaScript the value of this attribute represents the name of the corresponding class that is constructed for the implementation.】もし name 属性が指定されていなければ、バインディングの実装を個別に参照するために、バインディング文書の URI と id が用いられるようになります。
implements - implements 属性は、バインディングによって実装されるインタフェースの集合を記述するために用いられます。その値はカンマで区切られたインタフェース名のリストです。もし対応していれば、厳密な型のある言語では、バインドされた要素はその要素がすでにサポートしているインタフェース (例えば HTMLElement) としてだけでなく、この属性に記述されたすべてのインタフェースとしても参照できるようになります。この機能への対応は任意です。

constructor

constructor の内側にあるコードは、 binding が要素に対して適用されると同時に呼び出されます。したがってバインディングによって生成された匿名ノードへのフルアクセスはすでに可能となります。 constructor タグは implementation タグの内側に配置しなければなりません。

id - id 属性は文書中で一意となる識別子です。

注意: Firefox 3 以前では、コンストラクタはドキュメントレイアウトの reflow が完了した時点で呼び出されるため、コンストラクタ中のコードでレイアウト情報を取得しようとしても、古くなった情報しか得られません。 Firefox 3 以降では、コンストラクタは reflow が発生しうる時点で呼び出されますので、最新のレイアウト情報を得ることができます。詳しくはバグ 398404 を参照してください。

destructor

destructor の内側にあるコードは、要素から binding の適用を解除しようとすると同時に呼び出されます。これはリソースを破棄してメモリを解放するために用いられます。しかし、 destructor は呼び出されるはずの時に呼び出されないことがしばしばあります (バグ 230086参照)。 destructor タグは implementation タグの内側に配置しなければなりません。

id - id 属性は文書中で一意となる識別子です。

method

<!ENTITY % method-content "(parameter*,body?)">
<!ELEMENT method %method-content;>
<!ATTLIST method
   id               ID           #IMPLIED
   name             CDATA        #REQUIRED
   type             CDATA        #IMPLIED
>

method 要素は、バインディングの実装中の個々のメソッドを定義するために用いられます。

id - id 属性は文書中で一意となる識別子です。
name - name 属性の値は、メソッドがバインドされた要素へ結び付けられる際に付与される名前です。この値を用いてバインドされた要素から直接メソッドを呼び出すことができます。

例

<method name="scrollTo">
  <parameter name="index"/>
  <body>
    this.setAttribute("scrollpos", index);
  </body>
</method>

parameter

<!ELEMENT parameter EMPTY>
<!ATTLIST parameter
   id               ID           #IMPLIED
   name             CDATA        #REQUIRED
>

parameter 要素は、 method 要素の内側で用いられ、メソッドの個々の引数を表します。

id - id 属性は文書中で一意となる識別子です。
name - name 属性の値は、メソッドの body 要素内のスクリプトが引数を参照する際に用いられます。

body

<!ELEMENT body CDATA>
<!ATTLIST body
   id               ID           #IMPLIED
>

body 要素は、対応する method の実際の処理を表します。その内容はメソッドが呼び出されたときに実行するスクリプトです。

id - id 属性は文書中で一意となる識別子です。

field

<!ELEMENT field EMPTY>
<!ATTLIST field
   id               ID                  #IMPLIED
   name             CDATA               #REQUIRED
   readonly         (true|false)        #IMPLIED
>

フィールドは プロパティ に似ていますが、ゲッタとセッタを持つことができないという点で異なります。フィールドは、単純に値を保持するために有用です。 field 要素は、フィールドの初期値を決定するためのコードを内容として持つ必要があります。 field タグは、 implementation タグの内側に配置しなければなりません。

id - id 属性は文書中で一意となる識別子です。
name - フィールドの名前。これはバインドされた要素中でフィールドを参照するために用いられます。
readonly - true とした場合、フィールドは読み取り専用となります。この属性を省略した場合、フィールドは読み書きともに可能となります。

注意: Firefox 3 では、フィールドは、バインディングを適用したときではなく、初めてアクセスしたときに評価されるようになります。通常の使用方法であればこの変更によって問題が起こることはずはありませんが、コードの動作に影響を与える場合もあり得ます。詳しくはバグ 372769 を参照してください。

Firefox 3 でのこの変化によって、コードの動作が変わってしまうケースの例を示します。

2つのフィールドがあり、一方は A という名前で他方は B という名前だとします。フィールド A を .B にセットすると、 .B の値は .A へアクセス済みか否かに依存します。
バインディングのインスタンス生成後にプロトタイプチェーンへ proto を追加すると、これによってフィールドの値が影響を受けます（これは以前のバージョンの Firefox には当てはまりません）。
バインディング適用時、 <field name="parentNode">this.parentNode</field> は parentNode の値とはならず、 undefined となります。
バインディング適用前に（proto というよりも）オブジェクト自身へセットされたプロパティの値がフィールドによって変更されません。

property

<!ENTITY % property-content "(getter?,setter?)">
<!ELEMENT property %property-content;>
<!ATTLIST property
   id               ID                  #IMPLIED
   name             CDATA               #REQUIRED
   readonly         (true|false)        #IMPLIED
   onget            CDATA               #IMPLIED
   onset            CDATA               #IMPLIED
>

property 要素は、実装中の個々のプロパティを表します。プロパティは onget/onset 属性または property 要素内の getter/setter 要素によって定義された、ゲッタとセッタ関数のペアによって構成されます。メソッドと同様に、バインディングが適用されると同時に、バインドされた要素から直接プロパティを取得できるようになります。 property タグは、 implementation タグの内側に配置しなければなりません。

id - id 属性は文書中で一意となる識別子です。
name - プロパティの名前。バインドされた要素中でプロパティを参照する際に用いられます。
readonly - readonly 属性は、プロパティを読み取り専用にするために用いられ、プロパティの値は変更できなくなります。この属性を省略した場合、プロパティは読み書きともに可能となります。
onget - onget 属性の値は、プロパティの値が呼び出されたときに実行されるスクリプトです。この属性がセットされている場合、 property 要素内にて定められた初期値は無視されます。その代わり、 onget 属性の値として表されたスクリプトの戻り値が、呼び出し元へ返されます。プロパティのゲッタは、 property 要素の子要素として getter タグを使用することでも定義可能です。
onset - onset 属性の値は、プロパティの値が変更されようとしたときに実行されるスクリプトです。この属性がセットされている場合、 property 要素内にて定められた初期値は無視されます。スクリプト中の引数 val は、新たに割り当てられようとした値を表します。プロパティのセッタは、 property 要素の子要素として setter タグを用いることでも定義可能です。

getter

<!ELEMENT getter PCDATA>
<!ATTLIST getter
   id               ID                  #IMPLIED
>

getter 要素内には、プロパティが呼び出されたときに実行するスクリプトを記述します。 getter タグは、 property タグの内側に配置しなければなりません。

id - id 属性は文書中で一意となる識別子です。

setter

<!ELEMENT setter PCDATA>
<!ATTLIST setter
   id               ID                  #IMPLIED
>

setter 要素内には、プロパティへ値をセットしようとしたときに実行するスクリプトを記述します。 setter タグは、 property タグの内側に配置しなければなりません。

id - id 属性は文書中で一意となる識別子です。

handlers

<!ENTITY % handlers-content "handler*">
<!ELEMENT handlers %handlers-content;>
<!ATTLIST handlers
   id               ID                  #IMPLIED
>

handlers 要素内では、バインディング先の文書内にて要素に対して付加するイベントハンドラを定義します。イベントハンドラは、バインディングが適用されると同時に追加され、バインディングが解除されると同時に削除されます。 handlers タグは binding タグ内に配置しなければなりません。

id - id 属性は文書中で一意となる識別子です。

handler

<!ENTITY % handler-content "PCDATA">
<!ELEMENT handler %handler-content;>
<!ATTLIST handler
   id               ID                                  #IMPLIED
   event            NMREF                               #REQUIRED
   action           CDATA                               #IMPLIED
   phase            (capturing|bubbling|target)         #IMPLIED
   button           (1|2|3)                             #IMPLIED
   modifiers        CDATA                               #IMPLIED
   keycode          CDATA                               #IMPLIED
   key              CDATA                               #IMPLIED
   charcode         CDATA                               #IMPLIED
   clickcount       (1|2|3)                             #IMPLIED
   command          ID                                  #IMPLIED
   preventdefault   false|true                          #IMPLIED
>

handler 要素は、個々のイベントハンドラを表します。このイベントハンドラはバインディングが適用されたときにそのターゲットへ追加され、バインドされた要素からバインディングが解除されたときに削除されます。 handler の内側のスクリプトは、イベントハンドラに対応するイベントが発生したときに実行されます。 handler タグは、 handlers タグ内に配置しなければなりません。

id - id 属性は文書中で一意となる識別子です。
event - event 属性によって、このイベントハンドラが監視するイベントを指定します。その値は、 DOM の DocumentEvent インタフェースにしたがって生成された独自のイベントを含む、正当な DOM イベント名です。
action - action 属性内には、イベントハンドラが発動したときに呼び出されるスクリプトを記述します。親要素 handlers の type 属性によって、スクリプト言語を指定します。イベントハンドラのスクリプトは handler 要素の子要素としても記述することができます。
phase - この属性は、このイベントハンドラが監視すべきイベントフロー中のフェーズを指定します。その値は、 capturing, bubbling, target のいずれかとなります。フェーズが指定されている場合、イベントハンドリング処理のうちのそのフェーズ中でしかイベントハンドラは呼び出されないようになります。フェーズが指定されていない場合、デフォルトの bubbling であると想定されます。
button - button 属性は、イベントハンドラに対して フィルタ を付加します。これはマウスハンドラが個々のボタンを指定するために用いられます。 DOM MouseEvent オブジェクトの button フィールドの値と button 属性の値とがマッチした場合のみ、イベントハンドラが発動するようになります。
modifiers - modifiers 属性は、キーおよびマウスハンドラに対してフィルタを付加します。その値は、スペースまたはカンマで区切られた修飾キー (【訳注: Shift キーや Ctrl キーなど】) のリストです。イベントハンドラが発動するためには、リスト中の修飾キーが発生した DOM Event オブジェクトへセットされている必要があります。 modifiers が空でなく、リスト中に存在しない修飾キーが DOM Event オブジェクトへセットされている場合、イベントハンドラは発動しません。
サポートする修飾キー:
- shift
- alt
- control
- meta
- accel - プラットフォーム固有の主要アクセラレータキー。どの修飾キーが主要アクセラレータキーとなるかは、ユーザエージェントに一任される。 (Windows では Ctrl キー、 Mac では Meta キー)
- accesskey - ショートカットで用いられる、プラットフォーム固有の主要ニーモニックキー (Windows および Linux では Alt キー、 Mac では効果なし)
keycode - keycode 属性は、キーハンドラに対してフィルタを付加します。その値は、例えば vk_enter のような、特定のキーコードに対するキー識別子です。
筆者による注釈: 次期 DOM イベント仕様では、おそらく正しいキーコード文字列のリストがまとめられているだろう。
この属性が存在する場合、イベントハンドラが発動するためには、 DOM KeyEvent オブジェクトの keyCode フィールドが属性の値とマッチしていなければなりません。
charcode - charcode 属性は、キーハンドラに対してフィルタを付加します。その値は、例えば "z" のような一文字です。この属性が存在する場合、イベントハンドラが発動するためには、 DOM KeyEvent オブジェクトの charCode フィールドが属性の値とマッチしていなければなりません。
筆者による注釈: DOM イベントの成熟に伴い、より多くの属性が追加されるだろう。例えば、 MutationEvent [ DOMNodeInserted や DOMAttrModified 型などの、 DOM の変化に伴って発生するイベントは relatedTarget のようないくつかの新たなフィールドを定義しているので、フィルタリングの記述によってこれらに対応することになるかもしれない。
key - key 属性は、 charcode と同じ意味を持ちます。
clickcount - clickcount 属性は、イベントハンドラへ フィルタ を付加します。マウスハンドラに対して、ボタンが何回クリックされたかを指定するために用いられます。 DOM MouseEvent オブジェクトの clickcount フィールドの値と属性の値とがマッチした場合のみ、イベントハンドラが発動します。
command - イベントハンドラが発動したときに呼び出すコマンドの ID 。クロム権限を持たない文書中で用いた場合、イベントハンドラ全体が無視されます。
preventdefault - true をセットした場合、そのイベントのデフォルトの動作が実行されなくなります。 Event オブジェクトの preventDefault メソッドも参照してください。

resources

<!ENTITY % resources-content "(image?,stylesheet?)">
<!ELEMENT resources %resources-content;>
<!ATTLIST property
   id               ID                  #IMPLIED
>

バインディング内で使用する image 要素を前もってキャッシュしておくために用います。また、 stylesheet 要素をバインディング内で使用するために用います。 resources タグは、 binding タグの直下に配置しなければなりません。

id - id 属性は文書中で一意となる識別子です。

stylesheet

<!ELEMENT stylesheet EMPTY>
<!ATTLIST stylesheet
   id               ID                  #IMPLIED
   src              URI                 #REQUIRED
>

stylesheet 要素によって、バインディングで使用するスタイルシートを宣言します。スタイルシート中のスタイル規則は、バインディングに対してのみ適用され、文書中の他の要素に対しては適用されません。 stylesheet タグは、 resources タグ内に配置しなければなりません。

id - id 属性は文書中で一意となる識別子です。
src - バインディングのコンテントへ適用するスタイルシートの URL。

image

<!ELEMENT image EMPTY>
<!ATTLIST image
   id               ID                  #IMPLIED
   src              URI                 #REQUIRED
>

バインディング中で使用する画像リソースを宣言します。画像はバインディングが適用された直後にロードされます。画像を前もってロードし、後で利用するために用いられます。 image タグは、 resources タグ内に配置しなければなりません。

id - id 属性は文書中で一意となる識別子です。
src - ロードする画像の URL。