投稿日 2022/08/05 更新日 2022/08/05
こんにちは。当サイトの管理者「元木皇天」です。
今回はJavaScriptを使用してmaxlength属性またはminlength属性を削除する方法について解説いたします。
環境
OS:MacOS Big Sur ver11
GoogleChrom:Ver103
maxlength属性を削除する
minlength属性を削除する
実装サンプル
"max add"ボタンを押すと5文字までしか入力できなくなります。
"min add"ボタンを押すと最低5文字入力する必要があるようになります。
"max del"ボタンを押すと5文字までの制限がなくなります。
"min del"ボタンを押すと最低5文字の制限がなくなります。
ブラウザの開発者モードを開いて削除されることを確認してみてください。
参考文献
・HTML attribute: minlengthの公式ドキュメント
・HTML attribute: maxlengthの公式ドキュメント
・Element.removeAttribute()の公式ドキュメント
・JavaScript コードレシピ集
・改訂新版JavaScript本格入門 ~モダンスタイルによる基礎から現場での応用まで
要素のmaxlength属性を削除するにはremoveAttribute()メソッドを使用します。
使い方は以下の通りです。
HTML
<input id="sample" type="text" maxlength="10"/>
JavaScript
//DOMの取得 const sample = document.getElementById('sample'); //maxlengthを削除する sample.removeAttribute('maxlength');
取得したDOMに対してremoveAttribute()の引数に属性名を指定することで、対象の属性を削除することができます。
要素のminlength属性を削除するにはmaxlength同様removeAttribute()メソッドを使用します。
使い方は以下の通りです。
HTML
<input id="sample" type="text" minlength="10"/>
JavaScript
//DOMの取得 const sample = document.getElementById('sample'); //minlengthを削除する sample.removeAttribute('minlength');
取得したDOMに対してremoveAttribute()の引数に属性名を指定することで、対象の属性を削除することができます。
maxlength属性を追加・値の変更する方法は以下当サイトの別記事を参照してください。
minlength属性を追加・値の変更する方法は以下当サイトの別記事を参照してください。
maxlength属性またはminlength属性を削除するには
removeAttribute()
を使用します。