ホームページ >ウェブフロントエンド >jsチュートリアル >JS は createElement() を使用して HTML を動的に追加します
今回はcreateElement()を使ってJSにHTMLを動的に追加する方法を紹介します。createElement()を使ってJSにHTMLを動的に追加する場合の注意点を実際に見てみましょう。
1 はじめに
HTML タグを動的に追加するには、createElement()
メソッドを使用します。 createElement()
方法来实现。
CreateElement()
方法可以根据一个指定的类型来创建一个HTML标记。
语法:
sElement=document.createElement(sName)
CreateElement()
メソッドは、指定されたタイプに基づいて HTML タグを作成できます。 構文:
sElement=document.createElement(sName)
sElement: このメソッドによって返されるオブジェクトを受け取るために使用されます。 sName
: HTML タグのタイプと基本属性を設定するために使用されます。 2 つのアプリケーションテキスト ボックスを動的に追加する
この例では、[テキストを動的に追加] ボタンをクリックして、ページにテキスト ボックスを動的に追加します。 3 つのコード<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title> 动态添加HTML标记</title> <script language="javascript"> <!-- function addText() { var txt=document.createElement("input"); txt.type="text"; txt.name="txt"; txt.value="动态添加的文本框"; document.fm1.appendChild(txt); } --> </script> </head> <body> <form name="fm1"> <input type="button" name="btn1" value="动态添加文本框" onclick="addText();" /> </form> </body> </html>
推奨書籍:
実際のプロジェクトで vue コンポーネントの再利用を実装する方法
以上がJS は createElement() を使用して HTML を動的に追加しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。