Document.createElement() - 要素を作成する

2017/10/07

createElement()は、Documentのメソッドです。タグ名を指定して、要素を新しく作成します。

概要

名前

createElement

所属

IDL

[NewObject] Element createElement(DOMString localName, optional ElementCreationOptions options);

dictionary ElementCreationOptions {
  DOMString is;
};

仕様書

https://dom.spec.whatwg.org/#dom-document-createelement

説明

第1引数(localName)には、タグ名を指定します。

第2引数(options)には、カスタム要素で利用するオプションをオブジェクトで指定します。

返り値は、新しく作成した要素(Element)です。

チュートリアル

createElement()は、新しく要素を作成するメソッドです。作成したい要素のタグ名を引数に指定しましょう。

var element = document.createElement( "div" ) ;	// <div></div>
var element = document.createElement( "a" ) ;	// <a></a>
var element = document.createElement( "video" ) ;	// <video></video>

デモ

Document.createElement()のデモです。p要素を作成しています。

<!-- このコードは編集できます。 -->

<!DOCTYPE html>
<html>
<body>
<script>
var element = document.createElement( "p" ) ;

console.log( element ) ;

element.textContent = "SYNCER" ;
document.body.appendChild( element ) ;
</script>
</body>
</html>