Heim > Web-Frontend > js-Tutorial > JavaScript-Methode zum Erstellen von Elementen (Code)

JavaScript-Methode zum Erstellen von Elementen (Code)

不言
Freigeben: 2019-03-20 11:32:44
nach vorne
2454 Leute haben es durchsucht

Der Inhalt dieses Artikels befasst sich mit der Methode (Code) zum Erstellen von Elementen in JavaScript. Ich hoffe, dass er für Freunde hilfreich ist.

1. Erstellen Sie dynamisch Element eins document.write()

Geben Sie beispielsweise ein Li-Tag auf der Seite aus

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

Es wird in das Body-Tag eingefügt, aber diese Methode wird selten verwendet, da es sich auf das Layout der Seite auswirkt und sogar den ursprünglichen Inhalt der Seite verwischt, sodass nur der Ausgabeinhalt angezeigt wird

2. Erstellen Sie dynamisch Element 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>
Nach dem Login kopieren

div-Tag und ein p-Tag werden eingefügt und „Dies ist ein Tag“ wird auf der Seite ausgegeben wenn viele Tags hinzugefügt werden müssen.

3. Element drei 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>
Nach dem Login kopieren

Ein li-Tag wird unter dem div-Tag erstellt erforderlich Diese Methode wird selten verwendet

Dieser Artikel ist hier. Weitere spannende Inhalte finden Sie in der Spalte JavaScript-Tutorial-Video auf der chinesischen PHP-Website!

Das obige ist der detaillierte Inhalt vonJavaScript-Methode zum Erstellen von Elementen (Code). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:cnblogs.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage