خصائص textContent لعنصر DOM HTML

تعريف والاستخدام

textContent خصائص تعيين أو استرداد محتوى النص للعنصر المحدد وكذلك جميع أبنائه.

إذا قمت بتعيين textContent خصائص، ستحذف جميع العناصر الفرعية وتستبدلها بنقطة نصية واحدة تحتوي على النص المحدد.

نصيحة:في بعض الأحيان، يمكن استخدام هذه الخاصية لاستبدال خاصية nodeValue، ولكن تذكر أن هذه الخاصية ستعود أيضًا إلى النص لجميع العناصر الفرعية.

انظر أيضًا:

خصائص innerText

خصائص innerHTML

مثال

مثال 1

استرداد محتوى النص للعنصر:

let text = element.textContent;

جرب بنفسك

مثال 2

تغيير محتوى النص للعنصر <p> الذي يحتوي على id="demo":

element.textContent = "I have changed!";

جرب بنفسك

مثال 3

الحصول على محتوى النص الكامل للعنصر <ul> الذي يحتوي على id="myList":

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

جرب بنفسك

القواعد

استعادة نص العنصر:

element.textContent

أو

node.textContent

تعيين نص العنصر:

element.textContent = text
node.textContent = text

قيمة الخاصية

القيمة الوصف
text نص العنصر أو العنصر.

القيمة المعدة

النوع الوصف
النص

نص العنصر والأنساب.

إذا كان العنصر هو document أو document type أو notation، فإنه يعود null.

مقارنة innerHTML وinnerText مع textContent

يستعيد الخاصية innerText:

يستعيد فقط نص العنصر والأنساب، بدون الفراغات المخفية بواسطة CSS والعلامات، باستثناء عناصر <script> و<style>.

يستعيد الخاصية innerHTML:

محتوى النص للعنصر، بما في ذلك الفراغات والعلامات HTML الداخلية.

يستعيد الخاصية textContent:

محتوى النص لكل العناصر والأنساب، يحتوي على الفراغات والنصوص المخفية بواسطة CSS، ولكن لا يحتوي على علامات.

مثال HTML

<p id="myP">   هذا العنصر يحتوي على مسافة إضافية     ويحتوي على <span>عنصر span</span>.</p>

أمثلة JavaScript

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

جرب بنفسك

في المثال السابق:

يستعيد الخاصية innerText:

هذا العنصر يحتوي على مسافة إضافية و يحتوي على عنصر span.

يستعيد الخاصية innerHTML:

   هذا العنصر يحتوي على مسافة إضافية    ويحتوي على <span>عنصر span</span>.

يستعيد الخاصية textContent:

   هذا العنصر يحتوي على مسافة إضافية    ويحتوي على عنصر span.

دعم المتصفح

element.textContent هي خاصية مستوى DOM 3 (2004).

جميع المتصفحات يدعمونها بشكل كامل:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
الدعم 9-11 الدعم الدعم الدعم الدعم