document.createElement( tagName )は、Elementオブジェクトを作るメソッド。HTML要素を動的に作り出したいときなどに使う。
構文
$elementObject = document.createElement( tagName );
引数
- tagName
- 作りたいタグ名を指定する。
戻り値
Elementオブジェクト。
サンプル
サンプルの動作について
「サンプルボタン作成」ボタンをクリックすると、「サンプルボタン生成」ボタンの下に、「サンプル」というボタンを作成する。「サンプルボタン作成」ボタンをクリックするたびに追加していく。
サンプルのソースコード
JavaScript
<script type="text/javascript">
function sampleCreateElement() {
var $sampleButton = document.createElement( "BUTTON" );
$sampleButton.textContent = "サンプル";
document.getElementById( "sample" ).appendChild( $sampleButton );
}
</script>
function sampleCreateElement() {
var $sampleButton = document.createElement( "BUTTON" );
$sampleButton.textContent = "サンプル";
document.getElementById( "sample" ).appendChild( $sampleButton );
}
</script>
HTML
<button onclick="sampleCreateElement();">サンプルボタン作成</button>
<div id="sample" style="margin: 1em;"></div>
<div id="sample" style="margin: 1em;"></div>