HTML DOM Element textContent ominaisuus

Määrittely ja käyttötapa

textContent Ominaisuus asettaa tai palauttaa määritetyn solmun tekstisisällön sekä sen kaikkien jälkeläisten.

Jos olet asettanut textContent Ominaisuus poistaa kaikki lapsen solmut ja korvaa ne yksittäisellä tekstisolmulla, joka sisältää annetun merkkijonon.

Vinkki：Tämä ominaisuus voidaan joskus käyttää korvaamaan nodeValue-ominaisuus, mutta muista, että tämä ominaisuus palauttaa myös kaikkien lapsien tekstin.

Lisäksi katso：

innerText-ominaisuus

innerHTML-ominaisuus

Esimerkki

Esimerkki 1

Palauta elementin tekstisisältö：

let text = element.textContent;

Kokeile itse

Esimerkki 2

Muuta id="demo" -elementin <p>-elementin tekstisisältöä：

element.textContent = "I have changed!";

Kokeile itse

Esimerkki 3

Hanki id="myList" -elementin kaikki tekstisisällön osat：

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

Kokeile itse

Syntaksi

Palauta solmun tekstisisältö:

element.textContent

tai

node.textContent

Aseta solmun tekstisisältö:

element.textContent = text
node.textContent = text

Atribuuttiarvo

Arvo Kuvaus
text Elementin tai solmun tekstisisältö.

Palautusarvo

Tyyppi Kuvaus
Merkkijono

Elementin ja kaikkien sen jälkeläisten tekstisisältö.

Jos elementti on document, document type tai notation, palauttaa null.

innerHTML, innerText ja textContent eroavat toisistaan

innerText-ominaisuus palauttaa:

Palauttaa vain elementin ja kaikkien sen jälkeläisten tekstisisällön, ei CSS:llä piilotettua tekstiä, välitilaa ja merkkejä, paitsi <script> ja <style> -elementit.

innerHTML-ominaisuus palauttaa:

Elementin tekstisisältö, mukaan lukien kaikki välit ja sisäiset HTML-merkit.

textContent-ominaisuus palauttaa:

Elementin ja kaikkien jälkeläisten tekstisisältö, sisältäen välit ja CSS:llä piilotetun tekstin, mutta ilman merkkejä.

HTML-esimerkki

<p id="myP">   Tämä elementti sisältää ylimääräistä välitilaa ja sisältää <span>span-elementin</span>.</p>

JavaScript-esimerkkejä

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

Kokeile itse

Yllä olevassa esimerkissä:

innerText-ominaisuus palauttaa:

Tämä elementti sisältää ylimääräistä välitilaa ja sisältää span-elementin.

innerHTML-ominaisuus palauttaa:

   Tämä elementti sisältää ylimääräistä välitilaa ja sisältää <span>span-elementin</span>.

textContent-ominaisuus palauttaa:

   Tämä elementti sisältää ylimääräistä välitilaa ja sisältää span-elementin.

Selaimen tuki

element.textContent Se on DOM Level 3 (2004) ominaisuus.

Kaikki selaimet tukevat sitä täysin:

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