HTML DOM Element textContent özelliği

Tanım ve Kullanım

textContent Bu özellik, belirtilen düğümün metin içeriğini ve tüm alt nesnelerini döndürür.

Eğer textContent Bu özellik, tüm alt düğümleri siler ve belirtilen dizeyi içeren tek bir metin düğümü ile değiştirir.

İpucu:Bazen, bu özellik nodeValue özelliğinin yerini alabilir, ancak bu özellik aynı zamanda tüm alt düğümlerin metnini de döndürebilir.

Ayrıca bakınız:

innerText özelliği

innerHTML özelliği

Örnek

Örnek 1

Elemanın metin içeriğini döndürür:

let text = element.textContent;

Deneyin

Örnek 2

id="demo" olan <p> elementinin metin içeriğini değiştirir:

element.textContent = "I have changed!";

Deneyin

Örnek 3

id="myList" olan <ul> elementinin tüm metin içeriğini alır:

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

Deneyin

Sözdizimi

Düğümün metin içeriğini döndürün:

öge.textContent

veya

düğüm.textContent

Düğümün metin içeriğini ayarlayın:

öge.textContent = text
düğüm.textContent = text

Özellik Değeri

Değer Açıklama
text Öge veya düğümün metin içeriği.

Dönüş Değeri

Tür Açıklama
Dizgi

Öge ve tüm alt nesnelerin metin içeriği.

Öge document, document type veya notation ise null döndürür.

innerHTML, innerText ve textContent Arasındaki Farklar

innerText özelliği döndürür:

Sadece öge ve tüm alt ögelerin metin içeriğini döndürür, CSS gizli metin boşlukları ve etiketler yoktur, <script> ve <style> ögeleri dışında.

innerHTML özelliği döndürür:

Ögenin metin içeriği, tüm boşluklar ve iç HTML etiketleri içerir.

textContent özelliği döndürür:

Öge ve tüm alt nesnelerin metin içeriği, boşluklar ve CSS gizli metin içerir, ancak etiketler yoktur.

HTML Örneği

<p id="myP">   Bu öge ek boşluk içerir ve <span>bir span ögesi</span> içerir.</p>

JavaScript örnekleri

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

Deneyin

Yukarıdaki örnekte:

innerText özelliği döndürür:

Bu öge ek boşluk içerir ve bir <span>span ögesi</span> içerir.

innerHTML özelliği döndürür:

   Bu öge ek boşluk içerir ve <span>bir span ögesi</span> içerir.

textContent özelliği döndürür:

   Bu öge ek boşluk içerir ve bir <span>span ögesi</span> içerir.

Tarayıcı Desteği

element.textContent Bu, DOM Level 3 (2004) özelliğidir.

Tüm tarayıcılar onu tamamen destekliyor:

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