This page is a translated version of the page OOUI/Elements and the translation is 100% complete.

OOUI[1] ライブラリの最も基本的なコンポーネントは、要素 (OO.ui.Element) と呼ばれます。これは、DOM[2] — でのレンダリングを表すオブジェクトです。例えば、ボタン、アイコンなど、利用者に表示されるすべてのものです。 ウィジェットとは異なり、従来のプレーン要素は通常、イベントに関連付けられておらず、操作できません。

すべての OOUI 要素には $element プロパティがあります。これは、レンダリングされたコンテンツの jQuery 選択です。 OOUI は、DOM 要素の jQuery 選択を参照するすべての変数とプロパティの名前に $ 接頭辞を使用することに注意してください。 $element プロパティは非常に便利で、例えば OOUI ウィジェットを作成して DOM に追加する際に使用されます。

// 内容に「Sample Text」を持ち`sample`のCSSクラスがついている<div></div>の要素を作成します。
var e = new OO.ui.Element( {
	text: 'Sample Text',
	classes: [ 'sample' ]
} );

// 要素をDOMに追加します。
$( 'body' ).append( e.$element );

結果の HTML は以下のようになります:

<body>
	<div class="sample">Sample Text</div>
</body>

要素

脚注

  1. OOUI (Object-Oriented User Interface)
  2. DOM (Document Object Model)