HTMLDOMTextareaオブジェクト

HTML DOM Textareaオブジェクトは、HTMLドキュメントの要素を表します。</P> <p> Textareaオブジェクトを作成する</P> <h2>構文</h2> <p> 以下は構文です-</P> <pre>document.createElement(“TEXTAREA”);</pre> <h2>Textareaオブジェクトのプロパティ</h2> <table> <thead><tr><th>プロパティ</th> <th style ="text-align：center;">説明</th> </tr> </thead> <tbody><tr><td>オートフォーカス</td> <td>ページの読み込み時にテキスト領域が自動的にフォーカスされるかどうかを返し、変更します。</td> </tr> <tr> <td> defaultValue </td> <td>HTMLドキュメントのテキスト領域要素のデフォルト値を返して変更します。</td> </tr> <tr> <td> cols </td> <td>HTMLドキュメントのテキスト領域要素のcols属性の値を返したり変更したりします。</td> </tr> <tr><td>無効</td> <td>HTMLドキュメントのテキスト領域要素が無効になっているかどうかを返したり変更したりします</td> </tr> <tr><td>フォーム</td> <td>テキスト領域を囲むフォームの引用を返します。</td> </tr> <tr> <td> maxLength </td> <td>HTMLドキュメントのテキスト領域要素のmaxLength属性の値を返して変更します。</td> </tr> <tr><td>名前</td> <td>HTMLドキュメントのテキスト領域要素のname属性の値を返して変更します。</td> </tr> <tr><td>プレースホルダー</td> <td>HTMLドキュメントのテキスト領域要素のプレースホルダー属性の値を返し、変更します。</td> </tr> <tr> <td> readOnly </td> <td> HTMLドキュメントのテキスト領域要素のコンテンツを読み取り専用にするかどうかを返し、変更します。</td> </tr> <tr><td>必須</td> <td>HTMLドキュメントのテキスト領域の必須属性の値を返して変更します。</td> </tr> <tr><td>行</td> <td>HTMLドキュメントのテキスト領域要素のrows属性の値を返して変更します。</td> </tr> <tr><td>タイプ</td> <td>テキスト領域がHTMLドキュメントにあるフォーム要素のタイプを返します。</td> </tr> <tr><td>値</td> <td>HTMLドキュメントのテキスト領域要素のコンテンツを返したり変更したりします。</td> </tr> <tr><td>ラップ</td> <td>HTMLドキュメントのテキスト領域要素のwrap属性の値を返して変更します。</td> </tr> </tbody> </table> <h2>Textareaオブジェクトのメソッド</h2> <table> <thead><tr><th>メソッド</th> <th style ="text-align：center;">説明</th> </tr> </thead> <tbody> <tr> <td> select（）</td> <td>HTMLドキュメントのテキスト領域のコンテンツを選択します。</td> </tr> </tbody> </table> <p> Textareaオブジェクトの例を見てみましょう：</P> <h2>例</h2> <pre><!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></pre> <h2>出力</h2> <p> <img loading='lazy' alt='HTMLDOMTextareaオブジェクト ' src="/article/uploadfiles/202203/2022033116403305.jpg" /> </P> <p> 「<strong>テキストエリアの作成</strong>」をクリックします」ボタンをクリックして、textarea要素を作成します。</P> <p> <img loading='lazy' alt='HTMLDOMTextareaオブジェクト ' src="/article/uploadfiles/202203/2022033116403455.jpg" /> </P> <br> </div> <div class="ad5"><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4480737146802772" crossorigin="anonymous"></script>  <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-4480737146802772" data-ad-slot="2397329591" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> adsbygoogle = window.adsbygoogle || [].push{}; </script></div> <div id="turn-page" class="f-between"> <div class="page up f-align"> <i class="prev"></i> <a class='LinkPrevArticle' href='https://jp.wsxdn.com/pn014i/ay151t/1001065090.html' >HTML DOMテーブルcreateCaption（）メソッド </a> </div> <div class="page down f-align"> <a class='LinkNextArticle' href='https://jp.wsxdn.com/pn014i/ay151t/1001065092.html' >HTML DOMTableHeaderabbrプロパティ </a> <i class="next"></i> </div> </div> <section class="bottom-list"> <ol> <li class="f-between"> <div> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001065367.html" class="t-over" title="HTMLDOMタイトルオブジェクト "> <span>HTMLDOMタイトルオブジェクト </span> </a> <p class="r-over r-over-3"> HTMLのHTMLDOMTitle Objectは、要素を表します。を作成する要素 var titleObject = document.createElement(“TITLE”) ここでは、「titleObject」次のプロパティを持つことができます- プロパティ説明テキストドキュメントの要素の値を設定/返しますタイトルテキストの例を見てみましょうプロパティ- 例 <!DOCTYPE html> <html> <head> <title id="titleSe </p> </div> </li> <li class="f-between"> <div> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001065382.html" class="t-over" title="HTMLDOMUlオブジェクト "> <span>HTMLDOMUlオブジェクト </span> </a> <p class="r-over r-over-3"> HTMLのHTMLDOMUlオブジェクトは、を表します要素。を作成する要素 var ulObject = document.createElement(“UL”) ここでは、「ulObject」次のプロパティを持つことができますが、 HTML5ではサポートされていません − プロパティ説明コンパクト順不同リストを通常より小さく表示するかどうかを設定/返しますタイプ順序付けされていないリストのtype属性の値を設定/返します順不同リストの例を見てみましょう要素- 例 <!DOCTYPE </p> </div> </li> </ol> </section> </article> <aside class="box1-r box4-r"> <section class="small-nav"> <ul class="f-between"> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/gd144y/' target="_self">Cプログラミング</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/qo145i/' target="_self">C ++</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/jh146b/' target="_self">Redis</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/hf147z/' target="_self">BASHプログラミング</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/mk148e/' target="_self">Python</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/lj149d/' target="_self">Java</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/ay150s/' target="_self">データベース</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/ay151t/' target="_self">HTML</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/pn152h/' target="_self">Javascript</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/jh153b/' target="_self">プログラミング</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/if154a/' target="_self">CSS</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/ig155a/' target="_self">Ruby</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/jg156b/' target="_self">SQL</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/ig157b/' target="_self">IOS</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/wu158p/' target="_self">Android</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/ge159z/' target="_self">MongoDB</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/jh160b/' target="_self">MySQL</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/ec161w/' target="_self">C＃</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/gd165y/' target="_self">PHP</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/ig171a/' target="_self">SQL Server</a></li> </ul> </section> <div class="box1-r-list"> <div> <i></i> <span>HTML</span> </div> <ol> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001064435.html" class="r-over r-over-2" title="HTMLDOMHTMLオブジェクト ">HTMLDOMHTMLオブジェクト </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001064541.html" class="r-over r-over-2" title="HTMLDOMパラメータオブジェクト ">HTMLDOMパラメータオブジェクト </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001064542.html" class="r-over r-over-2" title="HTMLDOMスクリプトオブジェクト ">HTMLDOMスクリプトオブジェクト </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001064643.html" class="r-over r-over-2" title="HTMLDOMSオブジェクト ">HTMLDOMSオブジェクト </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001064661.html" class="r-over r-over-2" title="HTMLDOMサマリーオブジェクト ">HTMLDOMサマリーオブジェクト </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001064733.html" class="r-over r-over-2" title="HTMLDOMliオブジェクト ">HTMLDOMliオブジェクト </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001064748.html" class="r-over r-over-2" title="HTMLDOMリンクオブジェクト ">HTMLDOMリンクオブジェクト </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001064773.html" class="r-over r-over-2" title="HTMLDOM記事オブジェクト ">HTMLDOM記事オブジェクト </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001064801.html" class="r-over r-over-2" title="HTMLDOMBodyオブジェクト ">HTMLDOMBodyオブジェクト </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001064813.html" class="r-over r-over-2" title="HTMLDOMコードオブジェクト ">HTMLDOMコードオブジェクト </a> </li> </ol> </div> </aside> </section> <footer> <section> <span class="container f-center"> 著作権 © <a href="https://jp.wsxdn.com">https://jp.wsxdn.com</a> 全著作権所有 </span> </section> </footer> </body> </html>