Svojstvo JavaScript textContent služi za postavljanje i dobivanje tekstualnog sadržaja stranice. Koristi se za prosljeđivanje i prikaz tekstualnog sadržaja nekih informacija, oznaka i velike veličine podataka i njihovih čvorova. TextContent varira od nodeValue oznake skripte i vraća sadržaj iz podređenih čvorova više vrsta podataka.

Ako je čvor tekstualni čvor, instrukcija za obradu ili primjedba oznake, tada javascript textContent dobiva ili postavlja tekst. TextContent prikazuje ulančavanje textContent-a svakog podređenog čvora. Prikazuje upute za obradu i komentare za druge vrste čvorova.

Sintaksa

Postoje dvije sintakse dostupne za JavaScript tekstualni sadržaj. Prva sintaksa koristi se za postavljanje teksta čvora, a druga sintaksa koristi za dohvaćanje teksta čvora.

Sintaksa 1:

Sljedeća sintaksa koristi se za postavljanje teksta čvora pomoću tekstualnog sadržaja.

string format

 Node_element.textContent = information; 

Sintaksa 2:

Sljedeća sintaksa koristi tekstualni sadržaj za dobivanje teksta čvora.

 Node_element.textContent; 

Povratna vrijednost:

• Niz sadrži tekst izlaznog čvora i njegovog podređenog čvora. Izlaz prikazuje nultu vrijednost ako je element dokument ili vrsta dokumenta.
• Podređeni čvorovi zamijenjeni su jednim tekstualnim čvorom pomoću skupa atributa textContent. Atribut ima određeni niz kao sadržaj.

Primjeri

Sljedeći primjeri pokazuju skup i dobivanje različitih vrsta informacija pomoću atributa textContent.

Primjer 1

Sljedeći primjer koristi tekstualni sadržaj u javascriptu za postavljanje informacija. Podaci čvora prikazuju tekst oznaka.

 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;; } 

Izlaz

Sljedeća slika prikazuje skup podataka pomoću čvora sadržaja.

Primjer 2

Sljedeći primjer koristi tekstualni sadržaj u javascriptu za dobivanje informacija. Možemo dobiti vrijednost gumba funkcije klika.

 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; } 

Izlaz

Sljedeća slika prikazuje skup podataka pomoću čvora sadržaja.

Primjer 3

Sljedeći primjer koristi tekstualni sadržaj u javascriptu za dobivanje informacija. Možemo dobiti vrijednost gumba funkcije klika.

 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; } 

Izlaz

Sljedeća slika prikazuje skup podataka pomoću čvora sadržaja.

Primjer4

povezani popis

Sljedeći primjer koristi tekstualni sadržaj na vrijednosti gumba za dobivanje i postavljanje informacija. Vrijednost možemo dobiti nakon klika na gumb.

 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; } 

Izlaz

Sljedeća slika prikazuje skup podataka pomoću čvora sadržaja.

Primjer5

Sljedeći primjer koristi se za dobivanje i postavljanje informacija pomoću innerHtml-a, innerText-a i tekstualnog sadržaja na vrijednosti gumba. Razliku u izlaznim podacima možemo dobiti nakon klika na gumb.

 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;; } 

Izlaz

Sljedeća slika prikazuje skup podataka pomoću čvora sadržaja.

niz u polje java

Primjer 6

Sljedeći primjer koristi se za dobivanje podataka popisa i postavljanje informacija pomoću tekstualnog sadržaja na vrijednost gumba onclick. Možemo dobiti podatke popisa i druge informacije o oznakama.

 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; } 

Izlaz

Sljedeća slika prikazuje skup podataka pomoću čvora sadržaja.

Primjer 7

Tekstualni sadržaj ne podržava prazne podatke ako su informacije ili niz prazni. Prikazuje prazan niz kao vrijednost.

 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;; } } 

Izlaz

Sljedeća slika prikazuje dobivanje podataka pomoću čvora tekstualnog sadržaja.

Ključna točka tekstualnog sadržaja u javascriptu

• Kada javascript informacije automatski uklanjaju HTML, korištenje textContenta je sigurno.
• Tekstualni sadržaj i informacije uključuju razmake i oznake unutarnjih elemenata. InnerHTML atribut će ga vratiti.
• Atribut innerText vraća samo tekst bez razmaka ili oznaka unutarnjeg elementa. Svojstvo textContent vraća tekst koji uključuje razmake, ali isključuje oznake unutarnjih elemenata.
• Vrijednosti svih tekstualnih čvorova u podstablu se kombiniraju i postavljaju za tekstualni sadržaj i dobivaju iz tekstualnog sadržaja. Ako čvor nema djecu, niz je prazan.
• InnerText vraća tekst koji je čovjeku čitljiv i preuzima bilo koji CSS. Sadržaj teksta teško je čitati kada se u podacima koriste html oznake.
• Kada je svojstvo postavljeno na čvor, sva njegova djeca se uklanjaju, a jedan tekstualni čvor zauzima njegovo mjesto s navedenom vrijednošću.

Zaključak

Tekstualni sadržaj prikazuje više vrsta informacija. Oznaka html zahtijeva informacije i podatke popisa koji se prikazuju pomoću jedne metode.