„JavaScript“ ypatybė textContent veikia, kad nustatytų ir gautų puslapio teksto turinį. Jis naudojamas tam tikros informacijos, žymų ir didelio dydžio duomenų bei jų mazgų tekstiniam turiniui perduoti ir rodyti. „TextContent“ skiriasi nuo scenarijaus žymos nodeValue ir grąžina turinį iš kelių duomenų tipų antrinių mazgų.
Jei mazgas yra teksto mazgas, apdorojimo instrukcija arba žymos pastaba, tada javascript textContent gauna arba nustato tekstą. Teksto turinys rodo kiekvieno antrinio mazgo textContent sujungimą. Jame rodomos apdorojimo instrukcijos ir komentarai kitiems mazgų tipams.
Sintaksė
Yra dvi „JavaScript“ teksto turinio sintaksės. Pirmoji sintaksė naudojama mazgo tekstui nustatyti, o antroji sintaksė naudojama mazgo tekstui gauti.
1 sintaksė:
Ši sintaksė naudojama mazgo tekstui nustatyti naudojant tekstinį turinį.
sąrašą java į masyvą
Node_element.textContent = information;
2 sintaksė:
Ši sintaksė naudoja tekstinį turinį, kad gautų mazgo tekstą.
Node_element.textContent;
Grąžinimo vertė:
- Eilutėje yra išvesties mazgo ir jo antrinio mazgo tekstas. Išvestis rodo nulinę reikšmę, jei elementas yra dokumentas arba dokumento tipas.
- Antriniai mazgai pakeičiami vienu teksto mazgu, naudojant atributo textContent rinkinį. Atributo turinys turi tam tikrą eilutę.
Pavyzdžiai
Šie pavyzdžiai rodo rinkinį ir gauna įvairaus tipo informaciją naudojant atributą textContent.
1 pavyzdys
Šiame pavyzdyje informacijai nustatyti naudojamas javascript tekstinis turinys. Mazgo duomenys rodo žymų tekstą.
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>'; } Išvestis
Toliau pateiktame paveikslėlyje parodytas duomenų rinkinys naudojant turinio mazgą.
2 pavyzdys
Šiame pavyzdyje informacijai gauti naudojamas javascript tekstinis turinys. Galime gauti paspaudimo funkcijos mygtuko reikšmę.
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; } Išvestis
Toliau pateiktame paveikslėlyje parodytas duomenų rinkinys naudojant turinio mazgą.
3 pavyzdys
Šiame pavyzdyje informacijai gauti naudojamas javascript tekstinis turinys. Galime gauti paspaudimo funkcijos mygtuko reikšmę.
powershell mažesnis arba lygus
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; } Išvestis
Toliau pateiktame paveikslėlyje parodytas duomenų rinkinys naudojant turinio mazgą.
4 pavyzdys
Šiame pavyzdyje informacijai gauti ir nustatyti naudojamas mygtuko reikšmės tekstinis turinys. Vertę galime gauti paspaudę mygtuką.
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; } Išvestis
Toliau pateiktame paveikslėlyje parodytas duomenų rinkinys naudojant turinio mazgą.
5 pavyzdys
Šis pavyzdys naudojamas informacijai gauti ir nustatyti naudojant mygtuko vertės innerHtml, innerText ir teksto turinį. Išvesties duomenų skirtumą galime sužinoti paspaudę mygtuką.
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!'; } Išvestis
iškviesti js funkciją iš html
Toliau pateiktame paveikslėlyje parodytas duomenų rinkinys naudojant turinio mazgą.
6 pavyzdys
Šis pavyzdys naudojamas sąrašo duomenims gauti ir informacijai nustatyti naudojant mygtuko onclick vertės teksto turinį. Galime gauti sąrašo duomenis ir kitą žymų informaciją.
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; } Išvestis
Toliau pateiktame paveikslėlyje parodytas duomenų rinkinys naudojant turinio mazgą.
7 pavyzdys
Teksto turinys nepalaiko tuščių duomenų, jei informacija arba eilutė yra tuščia. Tai rodo tuščią eilutę kaip vertę.
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.'; } } Išvestis
Toliau pateiktame paveikslėlyje parodyta, kaip gauti duomenis naudojant teksto turinio mazgą.
Pagrindinis teksto turinio taškas javascript
- Kai javascript informacija automatiškai pašalina HTML, tada textContent naudojimas yra saugus.
- Teksto turinys ir informacija apima tarpus ir vidinių elementų žymas. InnerHTML atributas jį grąžins.
- Atributas innerText grąžina tik tekstą be jokių tarpų ar vidinių elementų žymų. Ypatybė textContent grąžina tekstą, kuriame yra tarpų, bet neįtraukiamos vidinių elementų žymos.
- Visų pomedžio teksto mazgų reikšmės sujungiamos ir nustatomos teksto turiniui ir gaunamos iš teksto turinio. Jei mazgas neturi vaikų, eilutė tuščia.
- InnerText grąžina tekstą, kuris yra lengvai skaitomas ir įtraukiamas į bet kurį CSS. Teksto turinį sunku perskaityti, kai duomenyse naudojamos html žymos.
- Kai mazgo ypatybė nustatoma, visi jo antriniai elementai pašalinami, o jo vietą užima vienas teksto mazgas su nurodyta verte.
Išvada
Teksto turinys rodo kelių tipų informaciją. HTML žymai reikalinga informacija ir sąrašo duomenys, rodomi vienu metodu.