<search>【検索コンテナ】

概要 ( 例 関連要素 外部リンク ) 構文 DOMインタフェース

概要

メモ

検索・フィルタリング操作に関連するフォーム・コンテンツのコンテナ
- 表示上の変化なし
- 検索結果の表示のみに使用するのは不適切

例

<search>
  <form action="～">
    名前：<input id="name" type="search">
    <button type="submit">検索</button>
  </form>
</search>

<form>【フォーム】

外部リンク

HTML Living Standard (英語)
- The search element
DOM
- DOM Living Standard (英語)

構文

<search

必須

開始タグ

【グローバル属性】

accesskey=【アクセスキー (複数：半角スペース区切り )】

アクセスキー

autocapitalize=【変換方法】

自動大文字化

"characters"	全て大文字
"on" "sentences"	各文の最初を大文字
"off" "none"	変換なし
"words"	各単語の最初を大文字

autofocus

ページロード時、自動フォーカス
※：<button>【ボタン】・<input>【汎用入力コントロール】・<textarea>【複数行入力コントロール】・<select>【選択リスト】はW3C定義の同名個別属性も参照

class=【クラス名 (複数：半角スペース区切り)】

所属クラス (複数指定：<style>【スタイル情報】)・外部スタイルシートで後の定義が優先

contenteditable [ ="" (可能) | true (可能) | false (不可) | inherit (親要素継承) ]

編集可否

contextmenu=<menu>【メニュー】のid

コンテキストメニューのid

data-*=【カスタムデータ】

カスタムデータ属性

dir=ltr (左から右) | rtl (右から左) | auto (自動)

文字表記方向 (ltr：left to right text or table / rtl：right to left text or table)
※<bdo>【テキスト方向形式】の場合、ltr または rtlが必須

draggable=true (ドラッグ可能) | false (ドラッグ不可) | auto (ブラウザ既定)

ドラッグ可否

dropzone=copy (ドロップデータのコピー) | move (ドロップデータを移動) | link (ドロップデータのリンク)

ドロップデータの扱い

enterkeyhint=【ヒント】

[Enter]キーのアクションヒント (対応するラベル・アイコン等を表示)

"done"	入力完了
"enter"	改行挿入
"go"	ターゲット移動
"next"	次フィールド移動
"previous"	前フィールド移動
"search"	検索結果移動
"send"	送信

hidden

非表示

id=【id】

id (ドキュメント中で一意 name【コントロール名 (送信データ名)】を含む)
スペース文字 (SP：U+0020・tab：U+0009・LF：U+000A・FF：U+000C・CR：U+000D) 以外の全ての文字が使用可能 (大文字小文字の区別あり)
(<a>【ハイパーリンク】のリンク先・CSS対象(#～)・スクリプト参照)

inputmode=【入力モード】

入力モード (参照：CSS ime-mode【IMEモード】)
※：<input>【汎用入力コントロール】・<textarea>【複数行入力コントロール】はW3C定義の同名個別属性も参照

"decimal"	小数数値入力 (フォーマット区切り文字表示)
"email"	Eメールアドレス入力 (補助入力：'@'・'.' 等)
"none"	未指定
"numeric"	数値入力
"search"	検索入力
"tel"	電話番号入力 ('0'〜'9'・'#'・'*'・ロケールにより対応アルファベット)
"text"	テキスト入力
"url"	URL入力 (補助入力：'/'・'.'・'www.'・'.com' 等)

is=【定義名】

定義名

itemid=【URL】

アイテムのグローバル識別子

itemprop=【アイテムのプロパティ (複数：半角スペース区切り)】

アイテムのプロパティ

itemref=【要素IDのリスト】

アイテムの参照リスト

itemscope

アイテムのプロパティ宣言

itemtype=【アイテムの型 (複数：半角スペース区切り)】

アイテムの型

lang=【言語コード】

言語コード (【主コード】-【副コード】例："ja"：日本語 / "en"：英語 / "en-US"：アメリカ英語)

nonce=【ワンタイムトークン (文字列)】

CSP(コンテンツセキュリティポリシー)のチェックで使用されるワンタイムトークン(nonce：number used once)
※：<link>【メタデータリンク】・<script>【スクリプト】・<style>【スタイル情報】はW3C定義の同名個別属性も参照

slot=【スロット名】

スロット (<slot>【スロット】の name属性に対応)

spellcheck=true | false

スペルチェック有無

style=【スタイルシート (複数：セミコロン区切り / 最後のセミコロンは省略可)】

スタイル

tabindex=【タブインデックス番号】

タブインデックス

title=【説明文】

説明 (多くはツールチップ表示)
※<link>【メタデータリンク】：メタデータリンクのタイトル
※<style>【スタイル情報】：スタイルシート名

translate="" (翻訳対象) | yes (翻訳対象) | no (翻訳対象外)

翻訳可否

フローコンテンツ
フォーム・コンテンツ等

</search>

必須

終了タグ

DOMインタフェース (HTMLElement)

interface HTMLElement : Element {
【プロパティ】
【HTMLElement プロパティ】 interface HTMLElement : Element WHATWG HTMLElement includes ElementContentEditable; HTMLElement includes HTMLOrSVGElement; HTMLElement includes GlobalEventHandlers; HTMLElement includes DocumentAndElementEventHandlers;
	DOMString	accessKey;	アクセスキー
	DOMString	autocapitalize;	自動大文字化
	DOMString	accessKeyLabel;	アクセスキー表現文字列
	DOMString	contentEditable;	編集可能状態 ("true"：編集可能 / "false"：編集不可 / "inherit"：親要素継承) ( ElementContentEditable に移動 )
	DOMStringMap	dataset;	カスタムデータ属性 (data-) マップ ( HTMLOrSVGElement* に移動 )
	DOMString	dir;	文字表記方向 ("ltr"：左から右 / "rtl"：右から左)
		draggable;	ドラッグ可否
[PutForwards=value]	attribute DOMTokenList	dropzone;	ドロップデータの扱い
		hidden;	非表示状態
[LegacyNullToEmptyString]	DOMString	innerText;	要素内容 (テキスト形式)
		isContentEditable;	編集可否 ( ElementContentEditable に移動 )
	DOMString	lang;	言語コード
[LegacyNullToEmptyString]	DOMString	outerText;	タグを含む要素内容 (テキスト形式)
		spellcheck;	スペルチェック有無
	attribute long	tabIndex;	タブインデックス ( HTMLOrSVGElement に移動 )
	DOMString	title;	説明
		translate;	翻訳可否
【ElementContentEditable プロパティ】 HTMLElement includes ElementContentEditable; ( interface mixin ElementContentEditable )
	DOMString	contentEditable;
	DOMString	enterKeyHint;
	DOMString	inputMode;
		isContentEditable;
【HTMLOrSVGElement プロパティ】 HTMLElement includes HTMLOrSVGElement; ( interface mixin HTMLOrSVGElement )
		autofocus;
	DOMStringMap	dataset;
	DOMString	nonce;
	attribute long	tabIndex;	タブインデックス
【GlobalEventHandlers プロパティ (一部) 】HTMLElement includes GlobalEventHandlers; WHATWG
	attribute EventHandler	on～;	各種イベントハンドラ (onclick・onfocus 等)
【DocumentAndElementEventHandlers プロパティ】 HTMLElement includes DocumentAndElementEventHandlers;
	attribute EventHandler	oncopy;	コピーイベントハンドラ
	attribute EventHandler	oncut;	カットイベントハンドラ
	attribute EventHandler	onpaste;	ペーストイベントハンドラ
【ElementCSSInlineStyle プロパティ】 HTMLElement implements ElementCSSInlineStyle; W3C：interface ElementCSSInlineStyle (英語)
	attribute CSSStyleDeclaration	style;	スタイル
	【CSSStyleDeclaration プロパティ】 (仕様上、次と同等： CSSStyleDeclaration implements CSS2Properties) W3C：Interface CSS2Properties (英語)
	DOMString	style.～;	スタイル属性 (例：style.color・style.backgroundColor)
【Element プロパティ】interface Element : Node Element includes ParentNode; Element includes NonDocumentTypeChildNode; Element includes ChildNode; Element includes Slottable;
[SameObject]	attribute NamedNodeMap	attributes;	関連属性マップ
[SameObject]	attribute DOMTokenList	classList;	クラス名リスト
	DOMString	className;	クラス名
	DOMString	id;	id (ページ内で一意：name【コントロール(送信)名】を含む)
	(DOMString	innerHTML;)	要素内容 (HTML形式)〔 DOM Parsing and Serialization 定義〕
	DOMString	localName;	ローカル名
	DOMString?	namespaceURI;	ネームスペースURI
	(DOMString	outerHTML;)	タグを含む要素内容 (HTML形式)〔 DOM Parsing and Serialization 定義〕
	DOMString?	prefix;	プレフィックス
	DOMString	tagName;	タグ名
【ParentNode プロパティ】interface mixin ParentNode
	attribute unsigned long	childElementCount;	子エレメントの数
[SameObject]	attribute HTMLCollection	children;	子エレメントコレクション
	Element?	firstElementChild;	最初の子エレメント
	Element?	lastElementChild;	最後の子エレメント
【NonDocumentTypeChildNode プロパティ】interface mixin NonDocumentTypeChildNode
	Element?	previousElementSibling;	前の兄弟エレメント
	Element?	nextElementSibling;	次の兄弟エレメント
【ChildNode プロパティ】
定義なし
【Slottable プロパティ】interface mixin Slottable
	attribute HTMLSlotElement?	assignedSlot;
【Node プロパティ】 interface Node : EventTarget
	attribute USVString	baseURI;	ベースURI
[SameObject]	NodeList	childNodes;	子ノードリスト
	Node?	firstChild;	先頭子ノード
	boolean	isConnected;
	Node?	lastChild;	最終子ノード
	Node?	nextSibling;	次の兄弟ノード
	DOMString	nodeName;	ノード名
	attribute unsigned short	nodeType;	ノードタイプ (ELEMENT_NODE / ATTRIBUTE_NODE / TEXT_NODE / CDATA_SECTION_NODE / ENTITY_REFERENCE_NODE / ENTITY_NODE / PROCESSING_INSTRUCTION_NODE / COMMENT_NODE / DOCUMENT_NODE / DOCUMENT_TYPE_NODE / DOCUMENT_FRAGMENT_NODE / NOTATION_NODE)
	DOMString?	nodeValue;	ノード値
	Document?	ownerDocument;	オーナードキュメント
	Element?	parentElement;	親エレメント
	Node?	parentNode;	親ノード
	Node?	previousSibling;	前の兄弟ノード
	DOMString?	textContent; (IE：innerText)	内容 (Text形式) (参照：Element.innerHTML・Element.outerHTML) 取得：要素内のHTMLタグを除外しテキストのみ設定：HTMLタグはテキスト変換
【メソッド】
【HTMLElement メソッド】 interface HTMLElement : Element WHATWG HTMLElement includes HTMLOrSVGElement;
ElementInternals attachInternals();
undefined click();			クリック操作
void focus();			フォーカス設定操作 ( HTMLOrSVGElement に移動 )
void forceSpellCheck();			スペルチェック
void blur();			フォーカス喪失操作 ( HTMLOrSVGElement に移動 )
【HTMLOrSVGElement メソッド】 HTMLElement includes HTMLOrSVGElement; ( interface mixin HTMLOrSVGElement )
undefined focus(optional FocusOptions options = {});			フォーカス設定操作
undefined blur();			フォーカス喪失操作
【Element メソッド】interface HTMLElement : Element WHATWG：Interface Element (英語)
DOMString? getAttribute(DOMString name);			属性取得
DOMString? getAttributeNS(DOMString? namespace, DOMString localName);			属性取得 (ネームスペース指定)
HTMLCollection getElementsByClassName(DOMString classNames);			エレメントコレクション取得 (クラス名指定)
HTMLCollection getElementsByTagName(DOMString localName);			エレメントコレクション取得 (タグ名指定)
HTMLCollection getElementsByTagNameNS(DOMString? namespace, DOMString localName);			エレメントコレクション取得 (ネームスペース・タグ名指定)
boolean hasAttribute(DOMString name);			属性チェック
boolean hasAttributeNS(DOMString? namespace, DOMString localName);			属性チェック (ネームスペース指定)
void removeAttribute(DOMString name);			属性削除
void removeAttributeNS(DOMString? namespace, DOMString localName);			属性削除 (ネームスペース指定)
void setAttribute(DOMString name, DOMString value);			属性設定
void setAttributeNS(DOMString? namespace, DOMString name, DOMString value);			属性設定 (ネームスペース指定)
【Node メソッド】 interface Element : Node WHATWG：Interface Node (英語)
Node appendChild(Node node);			子ノード追加
[NewObject] Node cloneNode(optional boolean deep = false);			クローンノード作成
unsigned short compareDocumentPosition(Node other);			他ノードとの位置比較 (DOCUMENT_POSITION_DISCONNECTED / DOCUMENT_POSITION_PRECEDING / DOCUMENT_POSITION_FOLLOWING / DOCUMENT_POSITION_CONTAINS / DOCUMENT_POSITION_CONTAINED_BY / DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC)
boolean contains(Node? other);			指定子孫ノードの存在有無
boolean hasChildNodes();			子ノードの存在有無
Node insertBefore(Node node, Node? child);			指定ノード前挿入
boolean isDefaultNamespace(DOMString? namespace);			デフォルトネームスペースチェック
boolean isEqualNode(Node? node);			同一ノードチェック
DOMString? lookupNamespaceURI(DOMString? prefix);			ネームスペースURI調査
DOMString? lookupPrefix(DOMString? namespace);			ネームスペースプレフィックス調査
void normalize();			標準化
Node removeChild(Node child);			子ノード削除
Node replaceChild(Node node, Node child);			子ノード置換
【ParentNode メソッド】Element implements ParentNode; WHATWG：Interface ParentNode (英語)
Element? querySelector(DOMString selectors);			指定セレクタ先頭エレメント取得
[NewObject] NodeList querySelectorAll(DOMString selectors);			指定セレクタノードリスト取得
【ChildNode メソッド】Element implements ChildNode; WHATWG：Interface ChildNode (英語)
void remove();			削除
};