Heim > Web-Frontend > js-Tutorial > Wie kann ich Div-Tag-Text mit JavaScript (ohne jQuery) abrufen?

Wie kann ich Div-Tag-Text mit JavaScript (ohne jQuery) abrufen?

Barbara Streisand
Freigeben: 2024-10-18 21:12:03
Original
323 Leute haben es durchsucht

How Can I Retrieve Div Tag Text Using JavaScript (Without jQuery)?

So rufen Sie Div-Tag-Text mit JavaScript ab (ohne jQuery)

Um den Textinhalt eines div-Elements ausschließlich mit JavaScript abzurufen, gibt es Alternativen zu jQuery.

Problemstellung:

Ein früherer Versuch, den Text mit document.getElementById('superman').value abzurufen, hat undefiniert zurückgegeben. Das Ziel besteht darin, eine Lösung mit einfachem JavaScript ohne jQuery zu finden.

Lösung:

Um den Text erfolgreich abzurufen, sollten Sie die Verwendung von textContent anstelle von value in Betracht ziehen. Die innerHTML-Eigenschaft gibt den gesamten DOM-Inhalt als String zurück, einschließlich der Elemente innerhalb des div. Im Gegensatz dazu extrahiert textContent speziell den Text innerhalb des Div und sorgt so für eine genauere Textdarstellung.

Zum Beispiel mit folgendem HTML:

<code class="html"><div id="test">
  Some <span class="foo">sample</span> text.
</div></code>
Nach dem Login kopieren

Verwendung von innerHTML:

<code class="javascript">var node = document.getElementById('test');
var htmlContent = node.innerHTML;
// htmlContent = "Some <span class="foo">sample</span> text."</code>
Nach dem Login kopieren

TextContent verwenden:

<code class="javascript">var node = document.getElementById('test');
var textContent = node.textContent;
// textContent = "Some sample text."</code>
Nach dem Login kopieren

Weitere Informationen zu textContent und innerHTML finden Sie im MDN:

  • [textContent](https://developer.mozilla.org/ en-US/docs/Web/API/Node/textContent)
  • [innerHTML](https://developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML)

Das obige ist der detaillierte Inhalt vonWie kann ich Div-Tag-Text mit JavaScript (ohne jQuery) abrufen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php
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
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage