HTML DOM Element textContent-egenskaben

Definition og brug

textContent Egenskaben definerer og bruges til at specificere og returnere tekstindholdet for en bestemt node samt alle dens efterkommere.

Hvis du har sat textContent Egenskaben vil fjerne alle underknuder og erstatte dem med en enkelt tekstknude, der indeholder den givne streng.

Tip:I nogle tilfælde kan denne egenskab bruges til at erstatte nodeValue-egenskaben, men husk at denne egenskab også returnerer teksten fra alle underknuder.

Se også:

innerText-egenskaben

innerHTML-egenskaben

Eksempel

Eksempel 1

Returner elementets tekstindhold:

let text = element.textContent;

Prøv det selv

Eksempel 2

Ændr tekstindholdet for <p>-elementet med id="demo":

element.textContent = "Jeg er blevet ændret!";

Prøv det selv

Eksempel 3

Få alle tekstindholdet for <ul>-elementet med id="myList":

text = document.getElementById("myList").textContent;

Prøv det selv

Syntaks

Returner nodens tekstindhold:

element.textContent

eller

node.textContent

Indstil nodens tekstindhold:

element.textContent = text
node.textContent = text

Attributværdi

Værdi Beskrivelse
text Elementets eller noderens tekstindhold.

Returverdi

Type Beskrivelse
Streng

Elementets og alle dets efterkommers tekstindhold.

Hvis elementet er document, document type eller notation, returneres null.

innerHTML, innerText og textContent forskel

innerText-egenskaben returnerer:

Returnerer kun elementets og alle dets efterkommers tekstindhold, uden skjult CSS tekst mellemrum og tags, med undtagelse af <script> og <style> elementer.

innerHTML-egenskaben returnerer:

Elementets tekstindhold, herunder alle mellemrum og interne HTML tags.

textContent-egenskaben returnerer:

Elementets og alle efterkommernes tekstindhold, med mellemrum og skjult CSS tekst, men uden tag.

HTML-eksempel

<p id="myP">   Dette elementet har ekstra afstand     og indeholder <span>et span-element</span>.</p>

JavaScript eksempler

let text = document.getElementById("myP").innerText;
let text = document.getElementById("myP").innerHTML;
let text = document.getElementById("demo").textContent;

Prøv det selv

I det ovenstående eksempel:

innerText-egenskaben returnerer:

Dette elementet har ekstra afstand og indeholder et span-element.

innerHTML-egenskaben returnerer:

   Dette elementet har ekstra afstand og indeholder <span>et span-element</span>.

textContent-egenskaben returnerer:

   Dette elementet har ekstra afstand og indeholder et span-element.

浏览器支持

element.textContent 是 DOM Level 3 (2004) 特性。

所有浏览器都完全支持它:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Support 9-11 Support Support Support Support