HTML DOM Input Number type プロパティとは？使い方をわかりやすく解説
HTML DOM の Input Number type プロパティは、type 属性が「number」に設定された input 要素に関連付けられたプロパティです。このプロパティは、数値入力フィールド（<input type="number">）に対して常に文字列「number」を返します。JavaScript でフォーム要素の種類を動的に確認したい場合などに役立ちます。
構文
Input Number type プロパティの構文は以下のとおりです。
numberObject.type
サンプルコード
HTML DOM Input Number type プロパティの具体的な使用例を見てみましょう。
<!DOCTYPE html>
<html>
<body>
<h1>Input Number type プロパティ</h1>
電話番号： <input type="number" id="NUMBER1">
<p>下のボタンをクリックすると、上記要素のタイプを取得できます</p>
<button onclick="getType()">タイプを取得</button>
<p id="Sample"></p>
<script>
function getType() {
var t = document.getElementById("NUMBER1").type;
document.getElementById("Sample").innerHTML = "入力フィールドのタイプは : "+t;
}
</script>
</body>
</html>
実行結果
このコードを実行すると、次のような画面が表示されます。
「タイプを取得」ボタンをクリックすると、以下のように表示されます。
コードの解説
上記の例では、以下のような処理を行っています。
まず、type 属性が「number」で、id が「NUMBER1」に設定された入力フィールドを作成しています。
電話番号： <input type="number" id="NUMBER1">
次に、ユーザーがクリックすると getType() 関数が実行される「タイプを取得」ボタンを配置しています。
<button onclick="getType()">タイプを取得</button>
getType() 関数内では、getElementById() メソッドを使って対象の入力要素を取得し、その type 属性の値を変数 t に代入します。その後、innerHTML プロパティを使用して、id が「Sample」の段落に取得した値を表示しています。
function getType() {
var t = document.getElementById("NUMBER1").type;
document.getElementById("Sample").innerHTML = "入力フィールドのタイプは : "+t;
}
-
HTML DOM Input Email typeプロパティとは？構文と使用例を解説
HTML DOMのInput Email typeプロパティは、<input type=email>要素のtype属性の値を取得または設定するために使用されます。このプロパティを活用することで、JavaScriptから動的に入力フィールドの種類を確認したり、必要に応じて変更したりすることが可能になります。 構文 以下に基本的な構文を示します。 文字列値を返す場合（取得） inputEmailObject.type typeに文字列値を設定する場合（設定） inputEmailObject.type = stringValue 指定できる文字列値 「stringValue」に
-
HTML DOM Input Number type プロパティとは？使い方をわかりやすく解説
HTML DOM の Input Number type プロパティは、type 属性が「number」に設定された input 要素に関連付けられたプロパティです。このプロパティは、数値入力フィールド（<input type=number>）に対して常に文字列「number」を返します。JavaScript でフォーム要素の種類を動的に確認したい場合などに役立ちます。 構文 Input Number type プロパティの構文は以下のとおりです。 numberObject.type サンプルコード HTML DOM Input Number type プロパティの具体的な使用