logo

Teksta saturs Javascript

JavaScript textContent rekvizīts darbojas, lai iestatītu un iegūtu lapas teksta saturu. To izmanto, lai nodotu un parādītu noteiktas informācijas teksta saturu, tagus un liela izmēra datus un to mezglus. TextContent atšķiras no skripta taga nodeValue un atgriež saturu no vairāku datu tipu pakārtotajiem mezgliem.

Ja mezgls ir teksta mezgls, apstrādes instrukcija vai atzīmes piezīme, tad javascript textContent iegūst vai iestata tekstu. Teksta saturs parāda katra pakārtotā mezgla textContent savienošanu. Tas parāda apstrādes instrukcijas un komentārus citiem mezglu veidiem.

Sintakse

JavaScript teksta saturam ir pieejamas divas sintakses. Pirmo sintakse izmanto, lai iestatītu mezgla tekstu, un otro sintakse izmanto, lai izgūtu mezgla tekstu.

1. sintakse:

Tālāk norādītā sintakse tiek izmantota, lai iestatītu mezgla tekstu, izmantojot teksta saturu.

haralds baldrs
 Node_element.textContent = information; 

2. sintakse:

Tālāk norādītajā sintakse izmanto teksta saturu, lai iegūtu mezgla tekstu.

 Node_element.textContent; 

Atgriešanas vērtība:

  • Virkne satur izvadmezgla un tā atvases mezgla tekstu. Izvade parāda nulles vērtību, ja elements ir dokuments vai dokumenta tips.
  • Pakārtotie mezgli tiek aizstāti ar vienu teksta mezglu, izmantojot atribūta textContent kopu. Atribūta saturam ir noteikta virkne.

Piemēri

Šajos piemēros ir parādīta kopa un iegūta dažāda veida informācija, izmantojot atribūtu textContent.

1. piemērs

Tālāk sniegtajā piemērā informācijas iestatīšanai tiek izmantots javascript teksta saturs. Mezglu dati parāda tagu tekstu.

 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(&apos;textContent_information&apos;); ele.textContent = &apos; <i> JavaScript </i> <h2> Set or get the content of node </h2>&apos;; } 

Izvade

Nākamajā attēlā ir parādīta datu kopa, izmantojot satura mezglu.

Teksta saturs Javascript

2. piemērs

Tālāk sniegtajā piemērā tiek izmantots javascript teksta saturs, lai iegūtu informāciju. Mēs varam iegūt klikšķa funkcijas pogas vērtību.

 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(&apos;myData1&apos;).textContent; function fdisplay() { document.getElementById(&apos;textContent_information&apos;).textContent = text_in; } 

Izvade

Izslēdzot izstrādātāja režīmu

Nākamajā attēlā ir parādīta datu kopa, izmantojot satura mezglu.

Teksta saturs Javascript

3. piemērs

Tālāk sniegtajā piemērā tiek izmantots javascript teksta saturs, lai iegūtu informāciju. Mēs varam iegūt klikšķa funkcijas pogas vērtību.

 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(&apos;value&apos;).textContent; document.getElementById(&apos;textContent_information&apos;).textContent = text_in; } 

Izvade

Nākamajā attēlā ir parādīta datu kopa, izmantojot satura mezglu.

Teksta saturs Javascript

4. piemērs

Tālāk sniegtajā piemērā tiek izmantots pogas vērtības teksta saturs, lai iegūtu un iestatītu informāciju. Mēs varam iegūt vērtību pēc pogas noklikšķināšanas.

 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(&apos;value&apos;).textContent = &apos;the information of the node has been changed using click function!&apos;; var text_in = document.getElementById(&apos;info&apos;).textContent; document.getElementById(&apos;values&apos;).textContent = text_in; } 

Izvade

Nākamajā attēlā ir parādīta datu kopa, izmantojot satura mezglu.

Teksta saturs Javascript

Piemērs5

Šis piemērs tiek izmantots, lai iegūtu un iestatītu informāciju, izmantojot innerHtml, innerText un teksta saturu pogas vērtībā. Mēs varam iegūt atšķirību izvades datos pēc pogas noklikšķināšanas.

 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(&apos;finfo&apos;).innerHTML = &apos; <b> textContent in JavaScript using node </b> the information of the node has been changed using click function!&apos;; } function sdisplay() { document.getElementById(&apos;sinfo&apos;).innerText = &apos; <b> textContent in JavaScript using node </b> <br> the information of the node has been changed using click function!&apos;; } function tdisplay() { document.getElementById(&apos;tinfo&apos;).textContent = &apos; <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!&apos;; } 

Izvade

Nākamajā attēlā ir parādīta datu kopa, izmantojot satura mezglu.

Teksta saturs Javascript

6. piemērs

Šis piemērs tiek izmantots, lai iegūtu saraksta datus un iestatītu informāciju, izmantojot teksta saturu pogas onclick vērtībā. Mēs varam iegūt saraksta datus un citu tagu informāciju.

 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(&apos;students&apos;).textContent; document.getElementById(&apos;tinfo&apos;).textContent = students; } 

Izvade

Nākamajā attēlā ir parādīta datu kopa, izmantojot satura mezglu.

Teksta saturs Javascript

7. piemērs

Teksta saturs neatbalsta tukšus datus, ja informācija vai virkne ir tukša. Tas parāda tukšo virkni kā vērtību.

css pasvītrot tekstu
 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(&apos;students&apos;).textContent; console.log(students); if(students != &apos;&apos;){ document.getElementById(&apos;tinfo&apos;).textContent = &apos;child node does not available of the student parent node.&apos;; }else{ document.getElementById(&apos;tinfo&apos;).textContent = &apos;child node is available of the student parent node.&apos;; } } 

Izvade

Nākamajā attēlā parādīta datu iegūšana, izmantojot teksta satura mezglu.

Teksta saturs Javascript

Javascript teksta satura galvenais punkts

  • Kad JavaScript informācija automātiski noņem HTML, teksta satura izmantošana ir droša.
  • Teksta saturs un informācija ietver atstarpes un iekšējo elementu tagus. InnerHTML atribūts to atgriezīs.
  • Atribūts innerText atgriež tikai tekstu bez atstarpēm vai iekšējo elementu tagiem. Rekvizīts textContent atgriež tekstu, kas ietver atstarpes, bet izslēdz iekšējo elementu tagus.
  • Visu apakškoka teksta mezglu vērtības tiek apvienotas un iestatītas teksta saturam un iegūtas no teksta satura. Ja mezglam nav bērnu, virkne ir tukša.
  • InnerText atgriež tekstu, kas ir cilvēkiem lasāms un iekļaujas jebkurā CSS. Teksta saturu ir grūti nolasīt, ja datos tiek izmantoti html tagi.
  • Ja mezglam ir iestatīts rekvizīts, visi tā atvasinājumi tiek noņemti, un tā vietu ieņem viens teksta mezgls ar norādīto vērtību.

Secinājums

Teksta saturs parāda dažāda veida informāciju. Html tagam bija nepieciešama informācija un saraksta dati, kas tiek parādīti, izmantojot vienu metodi.