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

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

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

// Create a <div></div> element object with the text “Sample Text“ and CSS class `sample`.
var e = new OO.ui.Element( {
	text: 'Sample Text',
	classes: [ 'sample' ]
} );

// Append the element to the DOM.
$( 'body' ).append( e.$element );

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

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

要素

References

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