HTML DOM Input Text autocomplete（オートコンプリート）プロパティの使い方
HTML DOM の Input Text autocomplete プロパティは、type="text" が指定された <input> 要素の autocomplete 属性と連動するプロパティです。この属性には「on」または「off」のいずれかの値を指定でき、「on」を設定すると Web ブラウザはユーザーの過去の入力履歴に基づいてテキストを自動補完します。一方、「off」を設定した場合は自動補完が行われません。
構文
autocomplete プロパティを設定する際の構文は以下のとおりです。
textObject.autocomplete = "on|off"
「on」を指定すると、ブラウザは過去の入力内容をもとにユーザーの入力を自動的に補完します。「off」を指定した場合は、過去の入力に基づく補完は一切行われません。このプロパティの既定値は「on」です。
補足：autocomplete をオフにするメリット
クレジットカード番号やワンタイムパスワードなど、セキュリティ上の理由から入力履歴を残したくない項目では、autocomplete="off" を設定することが推奨されます。
使用例
Input Text autocomplete プロパティの具体的な使用例を見てみましょう。
<!DOCTYPE html>
<html>
<body>
<h1>Input text autocomplete property</h1>
<form action="/Sample_page.php">
USERNAME: <input type="text" id="TEXT1" name="USR" autocomplete="on"><br><br>
<input type="submit">
</form>
<p>下のボタンをクリックすると、上のテキストフィールドのオートコンプリートが無効になります</p>
<button onclick="changeAuto()">Autocomplete Off</button>
<p id="Sample"></p>
<script>
function changeAuto() {
document.getElementById("TEXT1").autocomplete = "off";
document.getElementById("Sample").innerHTML = "Your text will not autocomplete now";
}
</script>
</body>
</html>
出力
上記のコードを実行すると、以下のような画面が表示されます。
テキストフィールドに何か文字を入力して数回送信してみてください。過去の入力履歴に基づいてテキストが自動補完される様子を確認できます。
続いて「Autocomplete Off」ボタンをクリックします。
ボタンをクリックすると autocomplete が「off」に切り替わり、以降はテキストの自動補完が行われなくなります。
-
HTML DOMのInput Text formプロパティとは？使い方とサンプルコードを解説
HTML DOMのInput Text formプロパティは、対象となるテキスト入力フィールド（input type=text）が属しているフォームへの参照を取得するために使用されます。もしテキストフィールドがどのフォームにも含まれていない場合は、nullが返されます。なお、このプロパティは読み取り専用です。つまり、値を参照することはできますが、JavaScriptから直接書き換えることはできません。構文Input Text formプロパティの基本的な構文は以下のとおりです。textObject.formサンプルコードここでは、実際にformプロパティを使って、テキストフィールドが所属するフ
-
HTML DOMのTitle textプロパティとは？使い方とサンプルコードを解説
HTML DOM の text プロパティは、ドキュメント内の <title> 要素が持つテキスト（タイトル文字列）を取得、または設定するために使用されます。このプロパティを活用することで、JavaScript からページタイトルを動的に読み取ったり変更したりすることが可能になります。 構文（シンタックス） テキスト値を取得する場合 titleElementObject.text テキスト値を文字列として設定する場合 titleElementObject.text = string 設定できる値は文字列のみです。指定した文字列がブラウザのタブやお気に入りに表示されるページタイトルと