HTMLOutputElement - HTMLのoutput要素

公開日: 2017/02/27

HTMLOutputElementは、HTMLのoutput要素が実装するインターフェイスです。

概要

名前

HTMLOutputElement

継承

実装

実装するインターフェイスはありません。

IDL

[HTMLConstructor]
interface HTMLOutputElement : HTMLElement {
  [CEReactions, SameObject, PutForwards=value] readonly attribute DOMTokenList htmlFor;
  readonly attribute HTMLFormElement? form;
  [CEReactions] attribute DOMString name;

  readonly attribute DOMString type;
  [CEReactions] attribute DOMString defaultValue;
  [CEReactions] attribute DOMString value;

  readonly attribute boolean willValidate;
  readonly attribute ValidityState validity;
  readonly attribute DOMString validationMessage;
  boolean checkValidity();
  boolean reportValidity();
  void setCustomValidity(DOMString error);

  [SameObject] readonly attribute NodeList labels;
};

仕様書

https://html.spec.whatwg.org/multipage/forms.html#htmloutputelement

説明

HTMLOutputElementを作成する例です。

JavaScript

// 要素を作成する
var element = document.createElement( "output" ) ;	// <output></output>

// 属性をセットする
element.name = "hoge" ;	// →<output name="hoge"></output>

// 内容をセットする
element.value = "SYNCER" ;	// →<output name="hoge">SYNCER</output>

プロパティ

Node、Element、HTMLElementのプロパティを利用できます。

HTMLOutputElement.defaultValue

Chrome: ●
Firefox: ●
Edge: ● 14+
IE: ×
Safari: ● 5.1+
Opera: ●
iOS: ●
Android: ● 4.0+

フォームのリセットを実行した時にセットされる初期値を返します。

HTMLOutputElement.form

Chrome: ●
Firefox: ●
Edge: ● 14+
IE: ×
Safari: ● 5.1+
Opera: ●
iOS: ●
Android: ● 4.0+

この要素が関連付けられているform要素を返します。

HTMLOutputElement.htmlFor

Chrome: ●
Firefox: ●
Edge: ● 14+
IE: ×
Safari: ● 5.1+
Opera: ● 15+
iOS: ●
Android: ● 4.0+

for属性を反映します。

HTMLOutputElement.labels

Chrome: ●
Firefox: ×
Edge: ×
IE: ×
Safari: ● 5.1+
Opera: ●
iOS: ●
Android: ● 4.0+

関連付けられている全てのlabel要素を、NodeListで返します。

HTMLOutputElement.name

Chrome: ●
Firefox: ●
Edge: ● 14+
IE: ×
Safari: ● 5.1+
Opera: ●
iOS: ●
Android: ● 4.0+

name属性を反映します。

HTMLOutputElement.type

Chrome: ●
Firefox: ●
Edge: ● 14+
IE: ×
Safari: ● 5.1+
Opera: ● 15+
iOS: ●
Android: ● 4.0+

"output"を返します。

HTMLOutputElement.validationMessage

Chrome: ●
Firefox: ●
Edge: ● 14+
IE: ×
Safari: ● 5.1+
Opera: ●
iOS: ●
Android: ● 4.0+

入力内容の検証エラーメッセージを文字列で返します。

HTMLOutputElement.validity

Chrome: ●
Firefox: ●
Edge: ● 14+
IE: ×
Safari: ● 5.1+
Opera: ●
iOS: ●
Android: ● 4.0+

入力内容の検証結果の情報を表すValidityStateを返します。

HTMLOutputElement.value

Chrome: ●
Firefox: ●
Edge: ● 14+
IE: ×
Safari: ● 5.1+
Opera: ●
iOS: ●
Android: ● 4.0+

内容を反映します。Node.textContentと同じです。

HTMLOutputElement.willValidate

Chrome: ●
Firefox: ●
Edge: ● 14+
IE: ×
Safari: ● 5.1+
Opera: ●
iOS: ●
Android: ● 4.0+

要素が、検証候補の場合はtrue、検証候補じゃない場合はfalseを返します。

メソッド

EventTarget、Node、Element、HTMLElementのメソッドを利用できます。

HTMLOutputElement.checkValidity()

Chrome: ●
Firefox: ●
Edge: ● 14+
IE: ×
Safari: ● 5.1+
Opera: ●
iOS: ●
Android: ● 4.0+

入力内容を検証し、検証エラーがある場合にinvalidイベントを発生させます。

HTMLOutputElement.reportValidity()

Chrome: ● 40+
Firefox: ● 49+
Edge: ● 14+
IE: ×
Safari: ×
Opera: ● 27+
iOS: ×
Android: ×

入力内容を検証し、検証エラーがある場合にinvalidイベントを発生させ、さらに、検証エラーメッセージを表示します。

HTMLOutputElement.setCustomValidity()

Chrome: ●
Firefox: ●
Edge: ● 14+
IE: ×
Safari: ● 5.1+
Opera: ●
iOS: ●
Android: ● 4.0+

カスタム検証エラー状態にします。または、カスタム検証エラー状態を解除します。

定数

Nodeの定数を利用できます。

サポート状況

HTMLOutputElementのサポート状況です。

ブラウザ	サポート状況	ブラウザ	サポート状況
Chrome	Supported	Firefox	Supported
Edge	Supported 14+	Internet Explorer	Not Supported
Safari	Supported 5.1+	Opera	Supported
iOS Safari	Supported	Android	Supported 4.0+

Chrome

バージョン	サポート状況	公開時期	シェア
57	Supported	2017年3月頃	0.1%
56	Supported	2017年1月頃	12.02%
55	Supported	2016年12月頃	12.36%
54	Supported	2016年10月頃	0.44%
53	Supported	2016年9月頃	0.25%
52	Supported	2016年7月頃	0.27%
51	Supported	2016年6月頃	0.4%
50	Supported	2016年4月頃	0.32%
49	Supported	2016年3月頃	0.47%
48	Supported	2016年1月頃	0.02%
47	Supported	2015年12月頃	0.06%
46	Supported	2015年10月頃	0.56%
45	Supported	2015年9月頃	0.01%
44	Supported	2015年7月頃	0.83%
43	Supported	2015年5月頃	0.05%
42	Supported	2015年4月頃	0.05%
41	Supported	2015年3月頃	0.01%
40	Supported	2015年1月頃	0.59%
39	Supported	2014年11月頃	0.02%
38	Supported	2014年10月頃	0.08%
37	Supported	2014年8月頃	0.01%
36	Supported	2014年7月頃	0.01%
35	Supported	2014年5月頃	0.01%
34	Supported	2014年4月頃	0.14%
33	Supported	2014年2月頃	0.01%
32	Supported	2014年1月頃	0%
31	Supported	2013年11月頃	0.01%
30	Supported	2013年10月頃	0.03%
29	Supported	2013年8月頃	0%
28	Supported	2013年6月頃	0.03%
27	Supported	2013年5月頃	0.01%
26	Supported	2013年3月頃	0%
25	Supported	2013年2月頃	0%
24	Supported	2013年1月頃	0%
23	Supported	2012年11月頃	0%
22	Supported	2012年9月頃	0%
21	Supported	2012年7月頃	0%
20	Supported	2012年6月頃	0%
19	Supported	2012年5月頃	0%
18	Supported	2012年3月頃	0.01%
17	Supported	2012年2月頃	0.01%
16	Supported	2011年12月頃	0%
15	Supported	2011年10月頃	0%
14	Supported	2011年9月頃	0%

Firefox

バージョン	サポート状況	公開時期	シェア
52	Supported	2017年3月頃	0.12%
51	Supported	2017年1月頃	1.7%
50	Supported	2016年11月頃	0.78%
49	Supported	2016年9月頃	0.02%
48	Supported	2016年8月頃	0.07%
47	Supported	2016年6月頃	0.03%
46	Supported	2016年4月頃	0.01%
45	Supported	2016年3月頃	0.1%
44	Supported	2016年1月頃	0.01%
43	Supported	2015年12月頃	0.02%
42	Supported	2015年11月頃	0.01%
41	Supported	2015年9月頃	0%
40	Supported	2015年8月頃	0.02%
39	Supported	2015年7月頃	0.01%
38	Supported	2015年5月頃	0.02%
37	Supported	2015年3月頃	0%
36	Supported	2015年2月頃	0.01%
35	Supported	2015年1月頃	0%
34	Supported	2014年12月頃	0.01%
33	Supported	2014年10月頃	0%
32	Supported	2014年9月頃	0%
31	Supported	2014年7月頃	0.01%
30	Supported	2014年6月頃	0%
29	Supported	2014年4月頃	0%
28	Supported	2014年3月頃	0.01%
27	Supported	2014年2月頃	0%
26	Supported	2013年12月頃	0%
25	Supported	2013年10月頃	0%
24	Supported	2013年9月頃	0%
23	Supported	2013年8月頃	0%
22	Supported	2013年6月頃	0%
21	Supported	2013年5月頃	0%
20	Supported	2013年4月頃	0%
19	Supported	2013年2月頃	0%
18	Supported	2013年1月頃	0%
17	Supported	2012年11月頃	0%
16	Supported	2012年10月頃	0%
15	Supported	2012年8月頃	0%
14	Supported	2012年7月頃	0%
13	Supported	2012年6月頃	0%
12	Supported	2012年4月頃	0%
11	Supported	2012年3月頃	0%
10	Supported	2012年1月頃	0%
9	Supported	2011年12月頃	0%
8	Supported	2011年11月頃	0%
7	Supported	2011年9月頃	0%
6	Supported	2011年8月頃	0%
5	Supported	2011年6月頃	0%
4	Supported	2011年3月頃	0%

Edge

バージョン	サポート状況	公開時期	シェア
14	Supported	2016年2月頃	1.05%
13	Not Supported	2015年9月頃	0.08%

Internet Explorer

バージョン	サポート状況	公開時期	シェア
11	Not Supported	2013年10月頃	4.99%
10	Not Supported	2012年8月頃	0.09%
9	Not Supported	2011年3月頃	0.18%
8	Not Supported	2009年3月頃	0.04%
7	Not Supported	2006年10月頃	0.01%
6	Not Supported	2001年8月頃	0%

Safari

バージョン	サポート状況	公開時期	シェア
10	Supported	2016年10月頃	0%
9.1	Supported	2015年9月頃	0%
8.0	Supported	2014年10月頃	0%
7.1	Supported	2013年10月頃	0%
6.0	Supported	2012年7月頃	0%
5.1	Supported	2011年7月頃	0%
4	Not Supported	2009年6月頃	0%

Opera

バージョン	サポート状況	公開時期	シェア
43	Supported	2017年2月頃	0.06%
42	Supported	2016年12月頃	0.09%
41	Supported	2016年10月頃	0.01%
40	Supported	2016年9月頃	0%
39	Supported	2016年8月頃	0%
38	Supported	2016年6月頃	0%
37	Supported	2016年5月頃	0.01%
36	Supported	2016年3月頃	0.01%
35	Supported	2016年2月頃	0%
34	Supported	2015年12月頃	0%
33	Supported	2015年10月頃	0%
32	Supported	2015年9月頃	0%
31	Supported	2015年8月頃	0%
30	Supported	2015年6月頃	0%
29	Supported	2015年4月頃	0%
28	Supported	2015年3月頃	0%
27	Supported	2015年1月頃	0%
26	Supported	2014年12月頃	0%
25	Supported	2014年10月頃	0%
24	Supported	2014年9月頃	0%
23	Supported	2014年7月頃	0%
22	Supported	2014年6月頃	0%
21	Supported	2014年5月頃	0.01%
20	Supported	2014年3月頃	0%
19	Supported	2014年1月頃	0%
18	Supported	2013年11月頃	0%
17	Supported	2013年10月頃	0%
16	Supported	2013年8月頃	0%
15	Supported	2013年7月頃	0%
12	Supported	2012年6月頃	0.02%
11.6	Supported	2011年12月頃	0%
11.1	Supported	2011年4月頃	0%

iOS Safari

バージョン	サポート状況	公開時期	シェア
10.0	Supported	2016年9月頃	39.65%
9.1	Supported	2015年9月頃	5.39%
8.3	Supported	2014年9月頃	1.03%
7.0	Supported	2013年9月頃	0.24%
6.0	Supported	2012年9月頃	0.05%
5.1	Supported	2011年10月頃	0.03%

Android

バージョン	サポート状況	公開時期	シェア
4.4	Supported	2013年10月頃	0%
4.3	Supported	2013年7月頃	0%
4.2	Supported	2013年3月頃	0.03%
4.1	Supported	2012年12月頃	0%
4.0	Supported	2012年6月頃	1.61%
2.3	Not Supported	2011年10月頃	0%