HTMLDOMTextareaオブジェクト
HTML DOM Textareaオブジェクトは、HTMLドキュメントの
Textareaオブジェクトを作成する
構文
以下は構文です-
document.createElement(“TEXTAREA”);
Textareaオブジェクトのプロパティ
プロパティ | 説明 |
---|---|
オートフォーカス | ページの読み込み時にテキスト領域が自動的にフォーカスされるかどうかを返し、変更します。 |
defaultValue | HTMLドキュメントのテキスト領域要素のデフォルト値を返して変更します。 |
cols | HTMLドキュメントのテキスト領域要素のcols属性の値を返したり変更したりします。 |
無効 | HTMLドキュメントのテキスト領域要素が無効になっているかどうかを返したり変更したりします |
フォーム | テキスト領域を囲むフォームの引用を返します。 |
maxLength | HTMLドキュメントのテキスト領域要素のmaxLength属性の値を返して変更します。 |
名前 | HTMLドキュメントのテキスト領域要素のname属性の値を返して変更します。 |
プレースホルダー | HTMLドキュメントのテキスト領域要素のプレースホルダー属性の値を返し、変更します。 |
readOnly | HTMLドキュメントのテキスト領域要素のコンテンツを読み取り専用にするかどうかを返し、変更します。 |
必須 | HTMLドキュメントのテキスト領域の必須属性の値を返して変更します。 |
行 | HTMLドキュメントのテキスト領域要素のrows属性の値を返して変更します。 |
タイプ | テキスト領域がHTMLドキュメントにあるフォーム要素のタイプを返します。 |
値 | HTMLドキュメントのテキスト領域要素のコンテンツを返したり変更したりします。 |
ラップ | HTMLドキュメントのテキスト領域要素のwrap属性の値を返して変更します。 |
Textareaオブジェクトのメソッド
メソッド | 説明 |
---|---|
select() | HTMLドキュメントのテキスト領域のコンテンツを選択します。 |
Textareaオブジェクトの例を見てみましょう:
例
<!DOCTYPE html> <html> <style> body { color: #000; background: lightseagreen; height: 100vh; text-align: center; } .btn { background: #db133a; border: none; height: 2rem; border-radius: 2px; width: 40%; display: block; color: #fff; outline: none; cursor: pointer; margin: 1rem auto; } </style> <body> <h1>DOM Textarea Object Demo</h1> <button onclick="create()" class="btn">Create Textarea</button> <script> function create() { var ta = document.createElement("TEXTAREA"); ta.innerHTML = "Hi! I'm a textarea element in an HTML document with some dummy text."; ta.setAttribute('rows', '8'); document.body.appendChild(ta); } </script> </body> </html>
出力
「テキストエリアの作成」をクリックします 」ボタンをクリックして、textarea要素を作成します。
-
HTMLDOMタイトルオブジェクト
HTMLのHTMLDOMTitle Objectは、要素を表します。 を作成する 要素 var titleObject = document.createElement(“TITLE”) ここでは、「titleObject」 次のプロパティを持つことができます- プロパティ 説明 テキスト ドキュメントの要素の値を設定/返します タイトルテキストの例を見てみましょう プロパティ- 例 <!DOCTYPE html> <html> <head> <title id="titleSe
-
HTMLDOMUlオブジェクト
HTMLのHTMLDOMUlオブジェクトは、 を表します 要素。 を作成する 要素 var ulObject = document.createElement(“UL”) ここでは、「ulObject」 次のプロパティを持つことができますが、 HTML5ではサポートされていません − プロパティ 説明 コンパクト 順不同リストを通常より小さく表示するかどうかを設定/返します タイプ 順序付けされていないリストのtype属性の値を設定/返します 順不同リストの例を見てみましょう 要素- 例 <!DOCTYPE