HTML DOM Document createElement() メソッド

定義と使用方法

createElement() 要素ノードを作成するメソッドです。

参照もしくは関連する:

Element appendChild() メソッド

Element insertBefore() メソッド

例1

新しい<p>要素を作成してドキュメントに追加します:

const para = document.createElement("p");
para.innerText = "This is a paragraph";
document.body.appendChild(para);

自分で試してみてください

例2

新しい<p>要素を作成してその要素に追加します:

const para = document.createElement("p");
para.innerHTML = "This is a paragraph.";
document.getElementById("myDIV").appendChild(para);

自分で試してみてください

例3

ボタンを作成します:

const btn = document.createElement("button");
btn.innerHTML = "Hello Button";
document.body.appendChild(btn);

自分で試してみてください

文法

document.createElement(tagName)

パラメータ

パラメータ 説明
tagName

必須です。作成する要素のタグ名を指定します。

HTMLのタグ名は任意の大文字小文字が使用できます。

XMLのタグ名は大文字小文字を区別します。

返り値

タイプ 説明
ノード 指定されたタグ名を持つ新しい要素ノードが作成されます。

投げ出します

tagNameに不適切な文字が含まれている場合、このメソッドはコードが INVALID_CHARACTER_ERR のDOMExceptionエラー。

ブラウザのサポート

document.createElement() DOMレベル1(1998)の機能です。

すべてのブラウザがサポートしています:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
サポート 9-11 サポート サポート サポート サポート