HTMLDOMボタンオブジェクト
HTMLDOMButtonオブジェクトは
プロパティ
以下は、HTMLDOMボタンオブジェクトのプロパティです-
| プロパティ | 説明 |
|---|---|
| オートフォーカス | ページの読み込み時にボタンが自動的にフォーカスされるかどうかを設定または返す。 |
| 無効 | 特定のボタンが無効になっているかどうかを設定または返すため。 |
| フォーム | ボタンを含むフォームの参照を返すため。 |
| formAction | ボタンのformAction属性値を設定または返すため。 |
| formEnctype | ボタンのformEnctype属性値を設定または返すため。 |
| formMethod | ボタンのformMethod属性値を設定または返すため。 |
| formNoValidate | 送信時にフォームデータを検証するかどうかを設定または返すため。 |
| formTarget | ボタンのformTarget属性値を設定または返すため。 |
| 名前 | ボタンのname属性値を設定または返すため。 |
| タイプ | ボタンの種類を設定または返すには。 |
| 値 | ボタンの値を設定または返すには。 |
構文
以下は、-
の構文です。ボタンオブジェクトの作成-
var x = document.createElement("BUTTON"); 例
HTMLDOMボタンオブジェクトの例を見てみましょう-
<!DOCTYPE html>
<html>
<body>
<p>Click on the below button to create a BUTTON element</p>
<button onclick="buttonCreate()">CREATE</button>
<br><br>
<script>
function buttonCreate() {
var x = document.createElement("BUTTON");
var t = document.createTextNode("NEW BUTTON");
x.appendChild(t);
document.body.appendChild(x);
}
</script>
</body>
</html> 出力
これにより、次の出力が生成されます-
[作成]-
をクリックすると
上記の例では-
最初にボタン要素CREATEを作成しました。このボタンは、クリックするとbuttonCreate（）関数を実行します。
<button onclick="buttonCreate()">CREATE</button>
buttonCreate（）メソッドは、ドキュメントオブジェクトのcreateElement（）メソッドを使用してボタン要素を作成し、それを変数xに割り当てます。テキストノードは、create要素を使用して作成され、変数tに割り当てられます。次に、テキストノードtは、appendchildメソッドを使用してボタンに追加されます。次に、ボタンとその子テキストノードが、document.body.appendChild（）メソッドを使用してドキュメント本文に子として追加されます。
function buttonCreate() {
var x = document.createElement("BUTTON");
var t = document.createTextNode("NEW BUTTON");
x.appendChild(t);
document.body.appendChild(x);
} -
HTMLDOMHRオブジェクト
HTML DOM HRオブジェクトは、HTMLドキュメントの要素を表します。 hrオブジェクトを作成- 構文 以下は構文です- document.createElement(“HR”); hrオブジェクトの例を見てみましょう- 例 <!DOCTYPE html> <html> <style> body { text-align: center; background-color: #fff;
-
HTMLDOMUlオブジェクト
HTMLのHTMLDOMUlオブジェクトは、 を表します 要素。 を作成する 要素 var ulObject = document.createElement(“UL”) ここでは、「ulObject」 次のプロパティを持つことができますが、 HTML5ではサポートされていません − プロパティ 説明 コンパクト 順不同リストを通常より小さく表示するかどうかを設定/返します タイプ 順序付けされていないリストのtype属性の値を設定/返します 順不同リストの例を見てみましょう 要素- 例 <!DOCTYPE