HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTML DOM Input Datetime の form プロパティの使い方とサンプルコード

HTML DOM の Input Datetime オブジェクトにおける form プロパティは、対象となる日時入力フィールド（<input type="datetime">）を囲んでいる <form> 要素への参照を返します。このプロパティは読み取り専用であり、要素がどのフォームに属しているかを JavaScript から動的に確認したい場合に役立ちます。

なお、入力フィールドがどのフォームにも属していない場合は、null が返されます。

構文

form プロパティの構文は以下の通りです。

フォームオブジェクトへの参照を返す場合：

inputDatetimeObject.form

使用例

ここで、Input Datetime の form プロパティを使った具体的な例を見てみましょう。ボタンをクリックすると、日時入力フィールドが属しているフォームの ID を画面に表示します。

<!DOCTYPE html>
<html>
<head>
<title>Input Datetime form</title>
</head>
<body>
<form id="dateTimeForm">
Date & Time: <input type="datetime" id="Datetime" value="2009-12-19T12:48Z">
</form>
<button onclick="getFormID()">Get Form ID</button>
<div id="divDisplay"></div>
<script>
    function getFormID() {
        var inputDatetime = document.getElementById("Datetime");
        var divDisplay = document.getElementById("divDisplay");
        divDisplay.textContent = 'Form ID for datetime input: '+inputDatetime.form.id;
    }
</script>
</body>
</html>

実行結果

上記のコードを実行すると、次のような出力が得られます。

「Get Form ID」ボタンをクリックする前：

HTML DOM Input Datetime の form プロパティの使い方とサンプルコード

「Get Form ID」ボタンをクリックした後：

HTML DOM Input Datetime の form プロパティの使い方とサンプルコード

ボタンをクリックすると、getElementById() で取得した日時入力要素に対して form.id を呼び出し、その結果として「Form ID for datetime input: dateTimeForm」というテキストが表示されます。このように、form プロパティを使えば、JavaScript から簡単に入力要素の親フォーム情報へアクセスできます。


  1. HTML DOM Input Weekのformプロパティとは？使い方とサンプルコードを解説

    HTML DOM Input Week form プロパティとはHTML DOM の Input Week form プロパティは、<input type=week> 要素が含まれている親フォーム（enclosing form）への参照を返します。このプロパティを使うことで、JavaScript から入力フィールドがどのフォームに属しているかを取得し、フォームの ID やその他のプロパティにアクセスすることができます。構文（シンタックス）form オブジェクトへの参照を返す場合の構文は以下の通りです。inputWeekObject.form使用例それでは、Input Week fo

  2. HTML DOM 入力パスワードのformプロパティとは？構文と使い方を実例で解説

    HTML DOM の Input Password（type=password の入力フィールド）における form プロパティは、そのパスワード入力フィールドを含むフォームへの参照を返すために使用されます。パスワード入力フィールドがフォームの外部に配置されている場合は、NULL が返されます。なお、このプロパティは読み取り専用です。 構文 Input Password の form プロパティの構文は次のとおりです。 passwordObject.form サンプルコード それでは、Input Password の form プロパティの具体的な使用例を見ていきましょう。 <!DOCT