Свойството textContent на JavaScript работи, за да зададе и получи текстовото съдържание на страницата. Използва се за предаване и показване на текстовото съдържание на някаква информация, етикети и голям размер на данните и техните възли. TextContent варира от nodeValue на маркера на скрипта и връща съдържание от дъщерни възли на множество типове данни.
Ако възелът е текстов възел, инструкция за обработка или забележка на етикет, тогава javascript textContent получава или задава текста. TextContent показва конкатенацията на textContent на всеки дъщерен възел. Той показва инструкциите за обработка и коментарите към другите типове възли.
Синтаксис
Има два налични синтаксиса за текстовото съдържание на JavaScript. Първият синтаксис използва за задаване на текста на възел, а вторият синтаксис използва за извличане на текста на възела.
Синтаксис 1:
Следният синтаксис се използва за задаване на текста на възела с помощта на текстово съдържание.
опитайте catch catch java
Node_element.textContent = information;
Синтаксис 2:
Следният синтаксис използва текстово съдържание, за да получи текста на възела.
Node_element.textContent;
Върната стойност:
- Низът съдържа текста на изходния възел и неговия дъщерен възел. Изходът показва нулева стойност, ако даден елемент е документ или тип документ.
- Дъщерните възли се заменят с единичен текстов възел с помощта на набора от атрибута textContent. Атрибутът има конкретен низ като съдържание.
Примери
Следващите примери показват набора и получават различни типове информация с помощта на атрибута textContent.
Пример 1
Следващият пример използва текстово съдържание в javascript, за да зададе информацията. Данните за възела показват текста на таговете.
textContent in JavaScript using node <h3> textContent in JavaScript using node </h3> <h4> Set node information for child javascript nodes</h4> Click Here! function display() { var ele = document.getElementById('textContent_information'); ele.textContent = ' <i> JavaScript </i> <h2> Set or get the content of node </h2>'; } Изход
Следното изображение показва набора от данни с помощта на възела на съдържанието.
Пример 2
Следващият пример използва текстово съдържание в javascript, за да получи информацията. Можем да получим стойността на бутона на функцията за кликване.
textContent in JavaScript using node <h3> textContent in JavaScript using node </h3> <h4> Get node information for child javascript nodes </h4> Get node information for child javascript nodes <br> Click the Button! var text_in = document.getElementById('myData1').textContent; function fdisplay() { document.getElementById('textContent_information').textContent = text_in; } Изход
Следното изображение показва набора от данни с помощта на възела на съдържанието.
Пример 3
Следващият пример използва текстово съдържание в javascript, за да получи информацията. Можем да получим стойността на бутона на функцията за кликване.
java инициализира масив
textContent in JavaScript using node <h3> textContent in JavaScript using node </h3> <h4> Set node information for child javascript nodes </h4> Click the Button! function fdisplay() { var text_in = document.getElementById('value').textContent; document.getElementById('textContent_information').textContent = text_in; } Изход
Следното изображение показва набора от данни с помощта на възела на съдържанието.
Пример4
Следващият пример използва текстово съдържание на стойността на бутона, за да получи и зададе информацията. Можем да получим стойността след натискане на бутона.
textContent in JavaScript using node <h3> textContent in JavaScript using node </h3> <p id="info"> Get node information for child javascript nodes </p> Click the Button! <br> See the value! function fdisplay() { document.getElementById('value').textContent = 'the information of the node has been changed using click function!'; var text_in = document.getElementById('info').textContent; document.getElementById('values').textContent = text_in; } Изход
Следното изображение показва набора от данни с помощта на възела на съдържанието.
Пример5
Следващият пример използва за получаване и задаване на информация с помощта на innerHtml, innerText и текстово съдържание на стойността на бутона. Можем да получим разликата в изходните данни след натискане на бутона.
textContent in JavaScript using node <h3> The textContent in JavaScript using node </h3> <p> Get node information for child javascript nodes </p> Click the innerHtml Button! Click the innerText Button! Click the textcontent Button! function fdisplay() { document.getElementById('finfo').innerHTML = ' <b> textContent in JavaScript using node </b> the information of the node has been changed using click function!'; } function sdisplay() { document.getElementById('sinfo').innerText = ' <b> textContent in JavaScript using node </b> <br> the information of the node has been changed using click function!'; } function tdisplay() { document.getElementById('tinfo').textContent = ' <b> textContent in JavaScript using node </b> <br> textContent in JavaScript using node <br> the information of the node has been changed using click function!'; } Изход
Следното изображение показва набора от данни с помощта на възела на съдържанието.
Пример 6
Следващият пример използва за получаване на данните от списъка и задаване на информацията с помощта на текстово съдържание върху стойността на бутона onclick. Можем да получим данните от списъка и друга информация за етикети.
textContent in JavaScript using node <h3> The textContent in JavaScript using node </h3> <p> Get node information for child javascript nodes </p> <ul id="students"> <li id="std1">David</li> <li id="std2">Sai</li> <li id="std3">Ruta</li> <li id="std4">Saniya</li> <li id="std5">Kevin</li> </ul> Click the textcontent Button! function tdisplay() { var students = document.getElementById('students').textContent; document.getElementById('tinfo').textContent = students; } Изход
Следното изображение показва набора от данни с помощта на възела на съдържанието.
Пример 7
Текстовото съдържание не поддържа празни данни, ако информацията или низът са празни. Той показва празния низ като стойност.
textContent in JavaScript using node <h3> The textContent in JavaScript using node </h3> <p> Get node information for child javascript nodes </p> <ul id="students"> </ul> Click the textcontent Button! function tdisplay() { var students = document.getElementById('students').textContent; console.log(students); if(students != ''){ document.getElementById('tinfo').textContent = 'child node does not available of the student parent node.'; }else{ document.getElementById('tinfo').textContent = 'child node is available of the student parent node.'; } } Изход
екта капуор актьор
Следното изображение показва възела за получаване на данни с помощта на текстово съдържание.
Ключова точка на текстовото съдържание в javascript
- Когато javascript информацията автоматично премахва HTML, тогава използването на textContent е безопасно.
- Текстовото съдържание и информация включват интервалите и етикетите на вътрешните елементи. Атрибутът innerHTML ще го върне.
- Атрибутът innerText връща само текст без интервали или тагове за вътрешни елементи. Свойството textContent връща текст, който включва интервали, но изключва тагове на вътрешни елементи.
- Стойностите на всички текстови възли в поддървото се комбинират и задават за текстово съдържание и се получават от текстовото съдържание. Ако даден възел няма деца, низът е празен.
- InnerText връща текст, който е четим от хора и приема всеки CSS. Текстовото съдържание е трудно за четене, когато в данните се използват html тагове.
- Когато свойство е зададено на възел, всички негови деца се премахват и единичен текстов възел заема неговото място с указаната стойност.
Заключение
Текстовото съдържание показва множество видове информация. HTML тагът изисква информация и списък с данни, показани с помощта на един метод.