ホームページ >ウェブフロントエンド >jsチュートリアル >要素を作成するための JavaScript メソッド (コード)

要素を作成するための JavaScript メソッド (コード)

不言
不言転載
2019-03-20 11:32:442461ブラウズ

この記事は JavaScript で要素を作成する方法 (コード) についての内容であり、一定の参考価値がありますので、困っている友人が参考になれば幸いです。

#1. 要素 1 の document.write()を動的に作成します。

たとえば、li タグをページに出力します

<pre class="html" name="code"><span style="font-size:12px;"><script>
  document.write("<li>123</li>");</script></span>

これは body タグに挿入されますが、ページのレイアウトに影響を与え、さらにはページの元のコンテンツを洗い流して出力コンテンツのみを表示するため、このメソッドはほとんど使用されません。

2.要素2のinnerHTML

<span style="font-size:12px;"><body>
<div id="box"></div>
<script>
  var box = document.getElementById("box");
  box.innerHTML = "<p>这是p标签</p>";
</script>
</body></span>
を動的に作成すると、divタグ内にpタグが挿入され、ページ上に「これはタグです」と出力されます。追加するタグが多い場合に使用する方法です。


3. 要素 3 を動的に作成します document.createElement()

<span style="font-size:12px;"><body>
<div id="div"></div>
<script>
  var divobj = document.getElementById("div"); var li = document.createElement("li"); //创建一个li标签 li.innerHTML = "123"; //给li标签赋值
divobj.appendChild(li); //将创建好的li标签追加到box标签中 </script> </body></span>
div タグの下に li タグが作成されます。必須 このメソッドはめったに使用されません


この記事はここで終了です。さらに興味深い内容については、PHP 中国語 Web サイトの

JavaScript チュートリアル ビデオ

列に注目してください。

以上が要素を作成するための JavaScript メソッド (コード)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はcnblogs.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。