path: root/files/ja/web/api/element/index.html

---
title: Element
slug: Web/API/Element
tags:
  - API
  - DOM
  - DOM Reference
  - Element
  - Interface
  - Reference
  - Web API
browser-compat: api.Element
translation_of: Web/API/Element
---
<div>{{APIRef("DOM")}}</div>

<p><span class="seoSummary"><strong><code>Element</code></strong> は {{DOMxRef("Document")}} の中にあるすべての要素オブジェクト (すなわち、要素を表現するオブジェクト) が継承する、もっとも一般的な基底クラスです。このインターフェイスは、すべての種類の要素に共通するメソッドとプロパティを記述するだけのものです。多くの具体的なクラスが <code>Element</code> を継承します。</span>例えば HTML 要素には {{DOMxRef("HTMLElement")}} インターフェイス、SVG 要素には {{DOMxRef("SVGElement")}} インターフェイスなど。ほとんどの機能は、クラスの階層を下りると具体化していきます。</p>

<p>XUL の <code>XULElement</code> インターフェイスのようなウェブプラットフォームの枠外の言語もまた、<code>Element</code> インターフェイスを通じて要素を実装しています。</p>

<p>{{InheritanceDiagram}}</p>

<h2 id="Properties">プロパティ</h2>

<p><em><code>Element</code> は、親インターフェスである {{DOMxRef("Node")}}、およびその親インターフェイスである {{DOMxRef("EventTarget")}} からプロパティを継承します。</em></p>

<dl>
 <dt>{{DOMxRef("Element.assignedSlot")}}{{readonlyInline}}</dt>
 <dd>このノードが挿入された {{htmlelement("slot")}} を表す {{DOMxRef("HTMLSlotElement")}} を返します。</dd>
 <dt>{{DOMxRef("Element.attributes")}} {{readOnlyInline}}</dt>
 <dd>対応する HTML 要素に関連したすべての属性のリストである {{DOMxRef("NamedNodeMap")}} を返します。</dd>
 <dt>{{domxref("Element.childElementCount")}} {{readonlyInline}}</dt>
 <dd>この要素の子要素の数を返します。</dd>
 <dt>{{domxref("Element.children")}} {{readonlyInline}}</dt>
 <dd>この要素の子要素を返します。</dd>
 <dt>{{DOMxRef("Element.classList")}} {{readOnlyInline}}</dt>
 <dd>class 属性のトークンリストを含む {{DOMxRef("DOMTokenList")}} を返します。</dd>
 <dt>{{DOMxRef("Element.className")}}</dt>
 <dd>{{DOMxRef("DOMString")}} 型であり、要素のクラスを表します。</dd>
 <dt>{{DOMxRef("Element.clientHeight")}} {{readOnlyInline}}</dt>
 <dd>要素の内部の高さを表す {{jsxref("Number")}} を返します。</dd>
 <dt>{{DOMxRef("Element.clientLeft")}} {{readOnlyInline}}</dt>
 <dd>要素の左境界の幅を表す {{jsxref("Number")}} を返します。</dd>
 <dt>{{DOMxRef("Element.clientTop")}} {{readOnlyInline}}</dt>
 <dd>要素の上境界の幅を表す {{jsxref("Number")}} を返します。</dd>
 <dt>{{DOMxRef("Element.clientWidth")}} {{readOnlyInline}}</dt>
 <dd>要素の内部の幅を表す {{jsxref("Number")}} を返します。</dd>
 <dt>{{domxref("Element.firstElementChild")}} {{readonlyInline}}</dt>
 <dd>アクセシビリティ向けに公開されたラベルを含む {{DOMxRef("DOMString")}} を返します。</dd>
 <dt>{{DOMxRef("Element.id")}}</dt>
 <dd>{{DOMxRef("DOMString")}} 型であり、要素の id を表します。</dd>
 <dt>{{DOMxRef("Element.innerHTML")}}</dt>
 <dd>{{DOMxRef("DOMString")}} 型であり、要素内容のマークアップを表します。</dd>
 <dt>{{domxref("Element.lastElementChild")}} {{readonlyInline}}</dt>
 <dd>Returns the last child element of this element.</dd>
 <dt>{{DOMxRef("Element.localName")}} {{readOnlyInline}}</dt>
 <dd>要素の修飾名のローカル部分を表す {{DOMxRef("DOMString")}} です。</dd>
 <dt>{{DOMxRef("Element.namespaceURI")}} {{readonlyInline}}</dt>
 <dd>要素の名前空間の URI。名前空間がない場合は <code>null</code> になります。
 <div class="note">
 <p><strong>注:</strong> Firefox 3.5 および以前のバージョンでは、HTML 要素の名前空間はありません。以降のバージョンでは、HTML 要素は HTML ツリーおよび XML ツリーで <code><a class="linkification-ext external" href="https://www.w3.org/1999/xhtml" title="Linkification: http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a></code> 名前空間内に存在します。</p>
 </div>
 </dd>
 <dt>{{DOMxRef("Element.nextElementSibling")}} {{readOnlyInline}}</dt>
 <dd>{{DOMxRef("Element")}} 型であり、ツリー上で自身の直後の要素 (弟) を表します。兄弟ノードがなければ <code>null</code>。</dd>
 <dt>{{DOMxRef("Element.outerHTML")}}</dt>
 <dd>{{DOMxRef("DOMString")}} 型であり、その要素を内容に含むマークアップを表します。設定に用いる場合、与えられた文字列からパースされたノードでその要素を置換します。</dd>
 <dt>{{DOMxRef("Element.part")}}</dt>
 <dd>要素のパート識別子 (すなわち、 <code>part</code> 属性を使用して設定されるもの) が、 {{domxref("DOMTokenList")}} として返されます。</dd>
 <dt>{{DOMxRef("Element.prefix")}} {{readOnlyInline}}</dt>
 <dd>要素の名前空間接頭辞を表す {{DOMxRef("DOMString")}}。接頭辞が指定されていない場合は <code>null</code>。</dd>
 <dt>{{DOMxRef("Element.previousElementSibling")}} {{readOnlyInline}}</dt>
 <dd>{{DOMxRef("Element")}} 型であり、ツリー上で自身の直前の要素 (兄) を表します。兄弟ノードが無ければ <code>null</code>。</dd>
 <dt>{{DOMxRef("Element.scrollHeight")}} {{readOnlyInline}}</dt>
 <dd>要素のスクロールビューの高さを表す {{jsxref("Number")}} を返します。</dd>
 <dt>{{DOMxRef("Element.scrollLeft")}}</dt>
 <dd>{{jsxref("Number")}} 型であり、要素の左スクロールオフセット値を表します。</dd>
 <dt>{{DOMxRef("Element.scrollLeftMax")}} {{Non-standard_Inline}} {{readOnlyInline}}</dt>
 <dd>要素で可能な左スクロールオフセットの最大値を表す {{jsxref("Number")}} を返します。</dd>
 <dt>{{DOMxRef("Element.scrollTop")}}</dt>
 <dd>文書の上端が垂直方向にスクロールされた量をピクセル数で表す {{jsxref("Number")}} です。</dd>
 <dt>{{DOMxRef("Element.scrollTopMax")}} {{Non-standard_Inline}} {{readOnlyInline}}</dt>
 <dd>要素で可能な上スクロールオフセットの最大値を表す {{jsxref("Number")}} を返します。</dd>
 <dt>{{DOMxRef("Element.scrollWidth")}} {{readOnlyInline}}</dt>
 <dd>要素のスクロールビュー幅を表す {{jsxref("Number")}} を返します。</dd>
 <dt>{{DOMxRef("Element.shadowRoot")}}{{readOnlyInline}}</dt>
 <dd>要素が所持しているオープンモードの Shadow Root、あるいはオープンモードの Shadow Root がない場合は null を返します。</dd>
 <dt>{{DOMxRef("Element.openOrClosedShadowRoot")}} {{Non-standard_Inline}}{{readOnlyInline}}</dt>
 <dd>オープン・クローズに関係なく、要素が所持している Shadow Root を返します。<strong><a href="/ja/docs/Mozilla/Add-ons/WebExtensions">WebExtensions</a> に限り使用できます。</strong></dd>
 <dt>{{DOMxRef("Element.slot")}} {{Experimental_Inline}}</dt>
 <dd>要素が挿入されている shadow DOM スロットの名前を返します。</dd>
 <dt>{{DOMxRef("Element.tagName")}} {{readOnlyInline}}</dt>
 <dd>要素のタグ名を {{jsxref("String")}} で返します。</dd>
</dl>

<h3 id="Properties_included_from_Aria">ARIA から導入されたプロパティ</h3>

<p><em><code>Element</code> インターフェイスは <code>ARIAMixin</code> ミックスインで定義されている以下のプロパティを持っています。</em></p>

<dl>
  <dt>{{domxref("Element.ariaAtomic")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-atomic</code> 属性を反映し、 <code>aria-relevant</code> 属性で定義された変更通知に基づいて、支援技術が変更された領域のすべてを提示するか、一部のみを提示するかを示します。</dd>
  <dt>{{domxref("Element.ariaAutoComplete")}}</dt>
  <dd>{{domxref("DOMString")}} で、 <code>aria-autocomplete</code> 属性を反映し、コンボボックス、サーチボックス、テキストボックスでテキストを入力する際に、ユーザーの意図した値の 1 つ以上の予測を表示するかどうか、予測が行われた場合にはどのように表示するかを指定します。</dd>
  <dt>{{domxref("Element.ariaBusy")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-busy</code> 属性を反映し、要素が修正されているかどうかを示します。支援技術では、修正が完了するまで待ってからユーザーに公開したい場合があります。</dd>
  <dt>{{domxref("Element.ariaChecked")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-checked</code> 属性を反映し、チェックボックス、ラジオボタン、その他のチェック状態を持つウィジェットの現在の「チェック」状態を示します。</dd>
  <dt>{{domxref("Element.ariaColCount")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-colcount</code> 属性を反映し、テーブル、グリッド、ツリーグリッドの列数を定義します。</dd>
  <dt>{{domxref("Element.ariaColIndex")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-colindex</code> 属性を反映し、テーブル、グリッド、ツリーグリッド内の列の総数に対する要素の列インデックスまたは位置を定義します。</dd>
  <dt>{{domxref("Element.ariaColIndexText")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-colindextext</code> 属性を反映し、 aria-colindex の代替となる人間が読めるテキストを定義します。</dd>
  <dt>{{domxref("Element.ariaColSpan")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-colspan</code> 属性を反映し、テーブル、グリッド、ツリーグリッド内のセルまたはグリッドセルがカバーする列数を定義します。</dd>
  <dt>{{domxref("Element.ariaCurrent")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-current</code> 属性を反映し、コンテナーまたは関連要素のセット内の現在の項目を表す要素を示します。</dd>
  <dt>{{domxref("Element.ariaDescription")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-description</code> 属性を反映し、現在の要素を説明または注釈する文字列値を定義します。</dd>
  <dt>{{domxref("Element.ariaDisabled")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-disabled</code> 属性を反映し、この要素が知覚可能であるが無効であるため、編集やその他の操作ができないことを示します。</dd>
  <dt>{{domxref("Element.ariaExpanded")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-expanded</code> 属性を反映し、この要素が所有または制御するグループ化要素が展開されているか畳まれているかを示します。</dd>
  <dt>{{domxref("Element.ariaHasPopup")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-haspopup</code> 属性を反映し、この要素によって引き起こされるメニューやダイアログのような対話型のポップアップ要素の有無と種類を示します。</dd>
  <dt>{{domxref("Element.ariaHidden")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-hidden</code> 属性を反映し、この要素がアクセシビリティ API に公開されているかどうかを示します。</dd>
  <dt>{{domxref("Element.ariaKeyShortcuts")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-keyshortcuts</code> 属性を反映し、要素を活性化したりフォーカスを与えたりするために作者が実装したキーボードショートカットを示します。</dd>
  <dt>{{domxref("Element.ariaLabel")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-label</code> 属性を反映し、現在の要素をラベル付けする文字列値を定義します。</dd>
  <dt>{{domxref("Element.ariaLevel")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-level</code> 属性を反映し、構造内の要素の階層レベルを定義します。</dd>
  <dt>{{domxref("Element.ariaLive")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-live</code> 属性を反映し、この要素が更新されること、ユーザーエージェント、支援技術、ユーザーがライブ領域から期待できる更新の種類を記述します。</dd>
  <dt>{{domxref("Element.ariaModal")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-modal</code> 属性を反映し、要素が表示されたときにモーダルであるかどうかを示します。</dd>
  <dt>{{domxref("Element.ariaMultiline")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-multiline</code> 属性を反映し、テキストボックスが複数行の入力を受け入れるか、一行のみを受け入れるかを示します。</dd>
  <dt>{{domxref("Element.ariaMultiSelectable")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-multiselectable</code> 属性を反映し、ユーザーが現在の選択可能な子孫から複数の項目を選択できることを示します。</dd>
  <dt>{{domxref("Element.ariaOrientation")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-orientation</code> 属性を反映し、要素の方向が水平、垂直、または不明/曖昧であることを示す。</dd>
  <dt>{{domxref("Element.ariaPlaceholder")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-placeholder</code> 属性を反映し、コントロールに値がない場合にユーザーのデータ入力を支援するための短いヒントを定義します。</dd>
  <dt>{{domxref("Element.ariaPosInSet")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-posinset</code> 属性を反映し、リストアイテムまたはツリーアイテムの現在のセットにおける要素の数または位置を定義します。</dd>
  <dt>{{domxref("Element.ariaPressed")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-pressed</code> 属性を反映し、トグルボタンの現在の「押された」状態を示します。</dd>
  <dt>{{domxref("Element.ariaReadOnly")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-readonly</code> 属性を反映し、要素が編集不可能であることを示すが、それ以外は操作可能であることを示します。</dd>
  <dt>{{domxref("Element.ariaRelevant")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-relevant</code> 属性を反映し、ライブリージョン内のアクセシビリティツリーが変更された場合に、ユーザエージェントがどのような通知を行うかを示します。これは、 <code>aria-live</code> リージョン内のどのような変更が関連性があり、アナウンスされるべきかを記述するために使用されます。</dd>
  <dt>{{domxref("Element.ariaRequired")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-required</code> 属性を反映し、フォームを送信する前に要素にユーザーの入力が必要であることを示します。</dd>
  <dt>{{domxref("Element.ariaRoleDescription")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-roledescription</code> 属性を反映し、要素の役割について、人間が読める、著者がローカライズした説明を定義します。</dd>
  <dt>{{domxref("Element.ariaRowCount")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-rowcount</code> 属性を反映し、テーブル、グリッド、ツリーグリッドの行の総数を定義します。</dd>
  <dt>{{domxref("Element.ariaRowIndex")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-rowindex</code> 属性を反映し、テーブル、グリッド、ツリーグリッド内の行の総数に対する要素の行インデックスまたは位置を定義します。</dd>
  <dt>{{domxref("Element.ariaRowIndexText")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-rowindextext</code> 属性を反映し、 aria-rowindex の代替となる人間が読めるテキストを定義しています。</dd>
  <dt>{{domxref("Element.ariaRowSpan")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-rowspan</code> 属性を反映し、テーブル、グリッド、ツリーグリッド内のセルまたはグリッドセルがカバーする行数を定義します。</dd>
  <dt>{{domxref("Element.ariaSelected")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-selected</code> 属性を反映し、選択状態を持つ要素の現在の「選択された」状態を示します。</dd>
  <dt>{{domxref("Element.ariaSetSize")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-setsize</code> 属性を反映し、現在のリストアイテムまたはツリーアイテムのセットのアイテム数を定義します。</dd>
  <dt>{{domxref("Element.ariaSort")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-sort</code> 属性を反映し、テーブルやグリッドのアイテムが昇順または降順でソートされるかどうかを示します。</dd>
  <dt>{{domxref("Element.ariaValueMax")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-valueMax</code> 属性を反映し、 range ウィジェットの最大許容値を定義します。</dd>
  <dt>{{domxref("Element.ariaValueMin")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-valueMin</code> 属性を反映し、 range ウィジェットに許容される最小値を定義します。</dd>
  <dt>{{domxref("Element.ariaValueNow")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-valueNow</code> 属性を反映し、 range ウィジェットの現在の値を定義します。</dd>
  <dt>{{domxref("Element.ariaValueText")}}</dt>
  <dd>{{domxref("DOMString")}} で <code>aria-valuetext</code> 属性を反映し、 range ウィジェットの aria-valuenow の代替となる人間が読めるテキストを定義ます。</dd>
</dl>

<h3 id="Handlers">イベントハンドラー</h3>

<dl>
 <dt>{{domxref("Element.onfullscreenchange")}}</dt>
 <dd>要素が全画面モードに入ったり出たりしたときに送られる {{event("fullscreenchange")}} イベントのイベントハンドラーです。これは期待された遷移が成功したかどうかを監視するために使用することができますが、アプリの実行がバックグラウンドになった場合など、想定外の変化を監視することもできます。</dd>
 <dt>{{domxref("Element.onfullscreenerror")}}</dt>
 <dd>全画面モードへ移行しようとしてエラーが発生したときに送られる {{event("fullscreenerror")}} イベントのイベントハンドラーです。</dd>
</dl>

<h2 id="Methods">メソッド</h2>

<p><em><code>Element</code> は親である {{DOMxRef("Node")}}、およびその親である {{DOMxRef("EventTarget")}} からメソッドを継承しています。</em></p>

<dl>
 <dt>{{DOMxRef("EventTarget.addEventListener()")}}</dt>
 <dd>要素に特定のイベント型を扱うイベントハンドラーを登録します。</dd>
 <dt>{{DOMxRef("Element.attachShadow()")}}</dt>
 <dd>指定した要素に shadow DOM ツリーを結びつけて、その {{DOMxRef("ShadowRoot")}} への参照を返します。</dd>
 <dt>{{DOMxRef("Element.animate()")}} {{Experimental_Inline}}</dt>
 <dd>要素でアニメーションを作成および実行するためのショートカットメソッドです。作成した Animation オブジェクトのインスタンスを返します。</dd>
 <dt>{{DOMxRef("Element.append()")}}</dt>
 <dd>この要素の最後の子の後に、一連の {{domxref("Node")}} オブジェクトまたは {{domxref("DOMString")}} オブジェクトを挿入します。</dd>
 <dt>{{DOMxRef("Element.closest()")}}</dt>
 <dd>引数に指定したセレクターによって選択される要素がもっとも近い祖先要素 (または当該要素自身) を {{DOMxRef("Element")}} 型で返します。</dd>
 <dt>{{DOMxRef("Element.createShadowRoot()")}} {{Non-standard_Inline}} {{Deprecated_Inline}}</dt>
 <dd>要素で <a href="/ja/docs/Web/Web_Components/Using_shadow_DOM">shadow DOM</a> を作成します。その要素はシャドウホストになります。 {{DOMxRef("ShadowRoot")}} を返します。</dd>
 <dt>{{DOMxRef("Element.computedStyleMap()")}} {{Experimental_Inline}}</dt>
 <dd>{{DOMxRef("CSSStyleDeclaration")}} に代わる、CSS 宣言ブロックを読み取り専用で表現したものを提供する {{DOMxRef("StylePropertyMapReadOnly")}} インターフェイスを返します。</dd>
 <dt>{{DOMxRef("EventTarget.dispatchEvent()")}}</dt>
 <dd>DOM 内のこの (this) ノードにイベントを送ります。そして、イベントをキャンセルしたハンドラーがないかを示す {{jsxref("Boolean")}} を返します。</dd>
 <dt>{{DOMxRef("Element.getAnimations()")}} {{Experimental_Inline}}</dt>
 <dd>要素でアクティブな Animation オブジェクトの配列を返します。</dd>
 <dt>{{DOMxRef("Element.getAttribute()")}}</dt>
 <dd>現在ノードから指定された名前の付いた属性値を取得して、 {{jsxref("Object")}} を返します。</dd>
 <dt>{{DOMxRef("Element.getAttributeNames()")}}</dt>
 <dd>現在の要素の属性名の配列を返します。</dd>
 <dt>{{DOMxRef("Element.getAttributeNode()")}}</dt>
 <dd>現在のノードから、指定された属性のノード表現を取得し、 {{DOMxRef("Attr")}} として返します。</dd>
 <dt>{{DOMxRef("Element.getAttributeNodeNS()")}}</dt>
 <dd>指定された名前と名前空間を持つ属性のノード表現を現在のノードから取得し、それを {{DOMxRef("Attr")}} として返します。</dd>
 <dt>{{DOMxRef("Element.getAttributeNS()")}}</dt>
 <dd>現在ノードから指定された名前と名前空間 (namespase) を持つ属性値を取得して、{{jsxref("Object")}} を返します。</dd>
 <dt>{{DOMxRef("Element.getBoundingClientRect()")}}</dt>
 <dd>要素のサイズと、ビューポートにおける位置を返します。</dd>
 <dt>{{domxref("Element.getBoxQuads()")}} {{experimental_inline}}</dt>
 <dd>{{domxref("DOMQuad")}} オブジェクトのリストを返し、これはノードの CSS フラグメントを表します。</dd>
 <dt>{{DOMxRef("Element.getClientRects()")}}</dt>
 <dd>クライアント (ソフト) 内のテキスト上の個々の行の外接矩形 (bounding rectangle) の集合を返します。</dd>
 <dt>{{DOMxRef("Element.getElementsByClassName()")}}</dt>
 <dd>現在の要素から、引数に指定したクラス名のリストに該当するすべての子孫要素を持つ {{DOMxRef("HTMLCollection")}} を返します。</dd>
 <dt>{{DOMxRef("Element.getElementsByTagName()")}}</dt>
 <dd>現在要素から、特定のタグ名を持つすべての子孫要素の集合を取得した {{DOMxRef("HTMLCollection")}} を返します。</dd>
 <dt>{{DOMxRef("Element.getElementsByTagNameNS()")}}</dt>
 <dd>現在要素から、特定のタグ名と名前空間を持つすべての子孫要素の集合を取得した {{DOMxRef("HTMLCollection")}} を返します。</dd>
 <dt>{{DOMxRef("Element.hasAttribute()")}}</dt>
 <dd>要素が指定された指定された属性を持っているか否かを示す {{jsxref("Boolean")}} を返します。</dd>
 <dt>{{DOMxRef("Element.hasAttributeNS()")}}</dt>
 <dd>要素が指定された名前空間内に指定された属性を持っているか否かを示す {{jsxref("Boolean")}} を返します。</dd>
 <dt>{{DOMxRef("Element.hasAttributes()")}}</dt>
 <dd>要素が現在 1 つ以上の属性をもっているかを示す {{jsxref("Boolean")}} を返します。</dd>
 <dt>{{DOMxRef("Element.hasPointerCapture()")}}</dt>
 <dd>呼び出された要素が、指定されたポインター ID によって識別されるポインターのポインターキャプチャを持っているかどうかを示します。</dd>
 <dt>{{DOMxRef("Element.insertAdjacentElement()")}}</dt>
 <dd>メソッドを実行した要素に対して相対的な指定位置に、要素ノードを挿入します。</dd>
 <dt>{{DOMxRef("Element.insertAdjacentHTML()")}}</dt>
 <dd>テキストを HTML または XML としてパースして、パース結果のノードをツリーの指定した位置に挿入します。</dd>
 <dt>{{DOMxRef("Element.insertAdjacentText()")}}</dt>
 <dd>メソッドを実行した要素に対して相対的な指定位置に、テキストノードを挿入します。</dd>
 <dt>{{DOMxRef("Element.matches()")}}</dt>
 <dd>要素が指定されたセレクター文字列で選択されているか否かを示す {{jsxref("Boolean")}} を返します。</dd>
 <dt>{{DOMxRef("Element.prepend()")}}</dt>
 <dd>この要素の最初の子の前に、一連の {{domxref("Node")}} オブジェクトまたは {{domxref("DOMString")}} オブジェクトを挿入します。</dd>
 <dt>{{DOMxRef("Element.querySelector()")}}</dt>
 <dd>要素に対して、指定したセレクターに一致する最初の {{DOMxRef("Node")}} を返します。</dd>
 <dt>{{DOMxRef("Element.querySelectorAll()")}}</dt>
 <dd>要素に対して、指定したセレクターに一致するノードの {{DOMxRef("NodeList")}} を返します。</dd>
 <dt>{{DOMxRef("Element.releasePointerCapture()")}}</dt>
 <dd>以前に特定の {{DOMxRef("PointerEvent","pointer イベント")}}向けに設定したポインターキャプチャーを解放 (停止) します。</dd>
 <dt>{{DOMxRef("Element.remove()")}}</dt>
 <dd>親要素の子リストから、要素を取り除きます。</dd>
 <dt>{{DOMxRef("Element.removeAttribute()")}}</dt>
 <dd>現在ノードから，指定された名前を持つ属性を取り除きます。</dd>
 <dt>{{DOMxRef("Element.removeAttributeNode()")}}</dt>
 <dd>現在のノードから名前の付いた属性のノード表現を削除します。</dd>
 <dt>{{DOMxRef("Element.removeAttributeNS()")}}</dt>
 <dd>現在ノードから，指定された名前と名前空間を持つ属性を取り除きます。</dd>
 <dt>{{DOMxRef("EventTarget.removeEventListener()")}}</dt>
 <dd>要素からイベントリスナーを取り除きます。</dd>
 <dt>{{DOMxRef("Element.replaceChildren()")}}</dt>
 <dd>{{domxref("Node")}} の既存の子を指定された新しい一連の子に置き換えます。</dd>
 <dt>{{DOMxRef("Element.replaceWith()")}}</dt>
 <dd>親の子リストの要素を、一連の {{domxref("Node")}} または {{domxref("DOMString")}} オブジェクトで置き換えます。</dd>
<dt>{{DOMxRef("Element.requestFullscreen()")}} {{Experimental_Inline}}</dt>
 <dd>要素を全画面表示するよう、ブラウザーへ非同期的に要求します。</dd>
 <dt>{{DOMxRef("Element.requestPointerLock()")}} {{Experimental_Inline}}</dt>
 <dd>指定した要素でポインターをロックするよう、非同期的に要求できます。</dd>
 <dt>{{domxref("Element.scroll()")}}</dt>
 <dd>指定された要素の中で特定の座標のセットへスクロールします。</dd>
 <dt>{{domxref("Element.scrollBy()")}}</dt>
 <dd>指定された量だけ要素をスクロールします。</dd>
 <dt>{{DOMxRef("Element.scrollIntoView()")}} {{Experimental_Inline}}</dt>
 <dd>要素がビューの内側に来るまでページをスクロールします。</dd>
 <dt>{{domxref("Element.scrollTo()")}}</dt>
 <dd>指定された要素の中で特定の座標のセットへスクロールします。</dd>
 <dt>{{DOMxRef("Element.setAttribute()")}}</dt>
 <dd>現在ノードに、指定された名前を持つ属性値を設定します。</dd>
 <dt>{{DOMxRef("Element.setAttributeNode()")}}</dt>
 <dd>現在のノードから指定された属性のノード表現を設定します。</dd>
 <dt>{{DOMxRef("Element.setAttributeNodeNS()")}}</dt>
 <dd>指定された名前と名前空間を持つ属性のノード表現を、現在のノードから設定します。</dd>
 <dt>{{DOMxRef("Element.setAttributeNS()")}}</dt>
 <dd>現在ノードに、指定された名前と名前空間を持つ属性値を設定します。</dd>
 <dt>{{DOMxRef("Element.setCapture()")}} {{Non-standard_Inline}}{{Deprecated_Inline}}</dt>
 <dd>すべてのマウスイベントを要素にリダイレクトし、マウスイベントキャプチャーを開始 (set up) します。</dd>
 <dt>{{DOMxRef("Element.setPointerCapture()")}}</dt>
 <dd>以降の <a href="/ja/docs/Web/API/Pointer_events">pointer イベント</a> のキャプチャー対象とする、特定の要素を指定します。</dd>
 <dt>{{DOMxRef("Element.toggleAttribute()")}}</dt>
 <dd>指定した要素で boolean 型の属性を切り替える、すなわち属性が存在していれば削除、属性が存在していなければ追加します。</dd>
</dl>

<h2 id="Events">イベント</h2>

<p>これらのイベントを待ち受けするには、 <code>addEventListener()</code> を使用するか、イベントリスナーをこのインターフェイスの <code>on<em>イベント名</em></code> プロパティに代入するかします。</p>

<dl>
 <dt>{{domxref("HTMLDialogElement/cancel_event", "cancel")}}</dt>
 <dd>ユーザーがブラウザーに、現在開いているダイアログを閉じたいと指示したときに {{HTMLElement("dialog")}} に発生します。ブラウザーがこのイベントを発生させる可能性があるのは、例えばユーザーが <kbd>Esc</kbd> キーを押したり、ブラウザーのユーザーインターフェイスの一部である「ダイアログを閉じる」ボタンをクリックしたりした場合です。<br>
 {{domxref("GlobalEventHandlers/oncancel", "oncancel")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/error_event", "error")}}</dt>
 <dd>リソースの読み込みに失敗したか、利用できなかった場合に発生します。例えば、スクリプトに実行エラーがあった場合や、画像が見つからなかった場合、無効であった場合などです。<br>
 {{domxref("GlobalEventHandlers/onerror", "onerror")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/scroll_event", "scroll")}}</dt>
 <dd>文書のビューまたは要素がスクロールしたときに発生します。<br>
 {{DOMxRef("GlobalEventHandlers.onscroll", "onscroll")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/select_event", "select")}}</dt>
 <dd>いくらかのテキストが選択されたときに発生します。<br>
 {{DOMxRef("GlobalEventHandlers.onselect", "onselect")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/show_event", "show")}}</dt>
 <dd>{{domxref("Element/contextmenu_event", "contextmenu")}} イベントが <code><a href="/ja/docs/Web/HTML/Global_attributes/contextmenu">contextmenu</a></code> 属性を持つ要素で発生したか、バブリングで到達した場合に発生します。 {{deprecated_inline}}<br>
 {{DOMxRef("GlobalEventHandlers.onshow", "onshow")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/wheel_event","wheel")}}</dt>
 <dd>ユーザーがポインティングデバイス (普通はマウス) のホイールボタンを回転させたときに発生します。<br>
 {{DOMxRef("GlobalEventHandlers.onwheel", "onwheel")}} プロパティから利用することもできます。</dd>
</dl>

<h3 id="Clipboard_events">クリップボードイベント</h3>

<dl>
 <dt>{{domxref("Element/copy_event", "copy")}}</dt>
 <dd>ユーザーがブラウザーのユーザーインターフェイスを通して、コピー操作を行ったときに発生します。<br>
 {{domxref("HTMLElement/oncopy", "oncopy")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/cut_event", "cut")}}</dt>
 <dd>ユーザーがブラウザーのユーザーインターフェイスを通して、切り取り操作を行ったときに発生します。<br>
 {{domxref("HTMLElement/oncut", "oncut")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/paste_event", "paste")}}</dt>
 <dd>ユーザーがブラウザーのユーザーインターフェイスを通して、貼り付け操作を行ったときに発生します。<br>
 {{domxref("HTMLElement/onpaste", "onpaste")}} プロパティから利用することもできます。</dd>
</dl>

<h3 id="Composition_events">構成イベント</h3>

<dl>
 <dt>{{domxref("Element/compositionend_event", "compositionend")}}</dt>
 <dd>{{glossary("input method editor")}} のようなテキスト構成システムで、現在の入力セッションが完了またはキャンセルされたときに発生します。</dd>
 <dt>{{domxref("Element/compositionstart_event", "compositionstart")}}</dt>
 <dd>{{glossary("input method editor")}} のようなテキスト構成システムで、新しい入力セッションを始まったときに発生します。</dd>
 <dt>{{domxref("Element/compositionupdate_event", "compositionupdate")}}</dt>
 <dd>{{glossary("input method editor")}} のようなテキスト構成システムによって制御されている入力セッションのコンテキストに、新しい文字が入力されたときに発生します。</dd>
</dl>

<h3 id="Focus_events">フォーカスイベント</h3>

<dl>
 <dt>{{domxref("Element/blur_event", "blur")}}</dt>
 <dd>要素がフォーカスを失ったときに発生します。<br>
 {{domxref("GlobalEventHandlers/onblur", "onblur")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/focus_event", "focus")}}</dt>
 <dd>要素がフォーカスを受け取ったときに発生します。<br>
 {{domxref("GlobalEventHandlers/onfocus", "onfocus")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/focusin_event", "focusin")}}</dt>
 <dd>要素がフォーカスを受け取ろうとしているときに発生します。</dd>
 <dt>{{domxref("Element/focusout_event", "focusout")}}</dt>
 <dd>要素がフォーカスを失おうとしているときに発生します。</dd>
</dl>

<h3 id="Fullscreen_events">全画面イベント</h3>

<dl>
 <dt>{{domxref("Element/fullscreenchange_event", "fullscreenchange")}}</dt>
 <dd>全画面モードへの移行時または終了時に、 {{domxref("Document")}} または {{domxref("Element")}} に送られます。</dd>
 <dd>{{domxref("Element.onfullscreenchange", "onfullscreenchange")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/fullscreenerror_event", "fullscreenerror")}}</dt>
 <dd>全画面モードへの移行または終了を試みている中でエラーが発生したときに、 <code>Document</code> または <code>Element</code> に送られます。</dd>
 <dd>{{domxref("Element.onfullscreenerror", "onfullscreenerror")}} プロパティから利用することもできます。</dd>
</dl>

<h3 id="Keyboard_events">キーボードイベント</h3>

<dl>
 <dt><code>{{domxref("Element/keydown_event", "keydown")}}</code></dt>
 <dd>キーが押されたときに発生します。<br>
 {{domxref("GlobalEventHandlers/onkeydown", "onkeydown")}} プロパティから利用することもできます。</dd>
 <dt><code>{{domxref("Element/keypress_event", "keypress")}}</code></dt>
 <dd>文字の値を発生させるキーが押されたときに発生します。 {{deprecated_inline}}<br>
 {{domxref("GlobalEventHandlers/onkeypress", "onkeypress")}} プロパティから利用することもできます。</dd>
 <dt><code>{{domxref("Element/keyup_event", "keyup")}}</code></dt>
 <dd>キーが離されたときに発生します。<br>
 {{domxref("GlobalEventHandlers/onkeyup", "onkeyup")}} プロパティから利用することもできます。</dd>
</dl>

<h3 id="Mouse_events">マウスイベント</h3>

<dl>
 <dt>{{domxref("Element/auxclick_event", "auxclick")}}</dt>
 <dd>ポインティングデバイスの第一ボタン以外のボタン (例えば、マウスの左ボタン以外のボタン) が要素上で押されて離されたときに発生します。<br>
 {{domxref("GlobalEventHandlers/onauxclick", "onauxclick")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/click_event", "click")}}</dt>
 <dd>ポインティングデバイスのボタン (例えば、マウスの第一ボタン) が単一の要素上で押されて離されたときに発生します。<br>
 {{domxref("GlobalEventHandlers/onclick", "onclick")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/contextmenu_event", "contextmenu")}}</dt>
 <dd>ユーザーがコンテキストメニューを開こうとしたときに発生します。<br>
 {{domxref("GlobalEventHandlers/oncontextmenu", "oncontextmenu")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/dblclick_event", "dblclick")}}</dt>
 <dd>ポインティングデバイスのボタン (例えば、マウスの第一ボタン) が単一の要素上で2回クリックされたときに発生します。<br>
 {{domxref("GlobalEventHandlers/ondblclick", "ondblclick")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/DOMActivate_event", "DOMActivate")}} {{Deprecated_Inline}}</dt>
 <dd>要素が、例えばマウスのクリックやキーの押下によってアクティブになったときに発生します。</dd>
 <dt>{{domxref("Element/mousedown_event", "mousedown")}}</dt>
 <dd>ポインティングデバイスのボタンが要素上で押されたときに発生します。<br>
 {{domxref("GlobalEventHandlers/onmousedown", "onmousedown")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/mouseenter_event", "mouseenter")}}</dt>
 <dd>ポインティングデバイス (ふつうはマウス) が、リスナーが割り当てられた要素の上へ移動したときに発生します。<br>
 {{domxref("GlobalEventHandlers/onmouseenter", "onmouseenter")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/mouseleave_event", "mouseleave")}}</dt>
 <dd>ポインティングデバイス (ふつうはマウス) が、リスナーが割り当てられた要素の外へ移動したときに発生します。<br>
 {{domxref("GlobalEventHandlers/onmouseleave", "onmouseleave")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/mousemove_event", "mousemove")}}</dt>
 <dd>ポインティングデバイス (ふつうはマウス) が、要素の上を移動したときに発生します。<br>
 {{domxref("GlobalEventHandlers/onmousemove", "onmousemove")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/mouseout_event", "mouseout")}}</dt>
 <dd>ポインティングデバイス (ふつうはマウス) が、リスナーが割り当てられた要素またはその子要素の外へ移動したときに発生します。<br>
 {{domxref("GlobalEventHandlers/onmouseout", "onmouseout")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/mouseover_event", "mouseover")}}</dt>
 <dd>ポインティングデバイス (ふつうはマウス) が、リスナーが割り当てられた要素またはその子要素の上を移動したときに発生します。<br>
 {{domxref("GlobalEventHandlers/onmouseover", "onmouseover")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/mouseup_event", "mouseup")}}</dt>
 <dd>ポインティングデバイスのボタンが要素の上で離されたときに発生します。<br>
 {{domxref("GlobalEventHandlers/onmouseup", "onmouseup")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/webkitmouseforcechanged_event", "webkitmouseforcechanged")}}</dt>
 <dd>trackpadtouchscreen の上の圧力が変化するたびに発生します。</dd>
 <dt>{{domxref("Element/webkitmouseforcedown_event", "webkitmouseforcedown")}}</dt>
 <dd>「強制クリック」と判断されるのに十分な圧力があった直後の mousedown イベントの後で発生します。</dd>
 <dt>{{domxref("Element/webkitmouseforcewillbegin_event", "webkitmouseforcewillbegin")}}</dt>
 <dd>{{domxref("Element/mousedown_event", "mousedown")}} イベントの前に発生します。</dd>
 <dt>{{domxref("Element/webkitmouseforceup_event", "webkitmouseforceup")}}</dt>
 <dd>「強制クリック」が終了したといえるほど圧力が減少した直後の {{domxref("Element/webkitmouseforcedown_event", "webkitmouseforcedown")}} イベントの後で発生します。</dd>
</dl>

<h3 id="Touch_events">タッチイベント</h3>

<dl>
 <dt>{{domxref("Element/touchcancel_event", "touchcancel")}}</dt>
 <dd>1つ以上のタッチ点が実装依存の理由により破棄された (例えば、タッチ点が多く作られすぎた) 場合に発生します。<br>
 {{domxref("GlobalEventHandlers/ontouchcancel", "ontouchcancel")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/touchend_event", "touchend")}}</dt>
 <dd>1つ以上のタッチ点がタッチ面から取り除かれたときに発生します。<br>
 {{domxref("GlobalEventHandlers/ontouchend", "ontouchend")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/touchmove_event", "touchmove")}}</dt>
 <dd>1つ以上のタッチ点がタッチ面上で移動したときに発生します。<br>
 {{domxref("GlobalEventHandlers/ontouchmove", "ontouchmove")}} プロパティから利用することもできます。</dd>
 <dt>{{domxref("Element/touchstart_event", "touchstart")}}</dt>
 <dd>1つ以上のタッチ点がタッチ面に配置されたときに発生します。<br>
 {{domxref("GlobalEventHandlers/ontouchstart", "ontouchstart")}} プロパティから利用することもできます。</dd>
</dl>

<h2 id="Specifications">仕様書</h2>

{{Specifications}}

<h2 id="Browser_compatibility">ブラウザーの互換性</h2>

<p>{{Compat}}</p>