Šajā apmācībā tiks aprakstītas metodes, kā dinamiski rakstīt HTML kodu, izmantojot JavaScript.
Kā dinamiski uzrakstīt HTML kodu, izmantojot JavaScript?
Lai rakstītu HTML kodu, izmantojot JavaScript, izmantojiet šādas metodes:
1. metode: dinamiski rakstiet HTML kodu, izmantojot metodi document.createElement().
JavaScript “ document.createElement() ' metode ar ' teksta saturs ” rekvizīts tiek izmantots, lai dinamiski rakstītu HTML kodu JavaScript valodā. Izmantojot metodi createElement(), var izveidot noteiktu HTML elementu, un teksta satura iestatīšanai tiek izmantots rekvizīts textContent.
Sintakse
Izmantojiet norādīto sintaksi, lai izveidotu HTML elementu JavaScript:
dokumentu. izveidotElement ( 'tagName' )
Piemērs
Šeit vispirms mēs izveidosim rindkopu JavaScript failā, izmantojot HTML tagu
, kas nodots ' CreateElement() ” metode:
konst tekstu = dokumentu. izveidotElement ( 'p' ) ;Izmantojiet rekvizītu textContent, lai iestatītu tekstu rindkopā:
tekstu. teksta saturs = 'Laipni lūdzam Linuxhint' ;
Visbeidzot izdrukājiet tekstu tīmekļa lapā, izmantojot ' document.write() ” metode:
dokumentu. rakstīt ( tekstu. teksta saturs ) ;Šeit jūs varat redzēt izvadā, ka mēs veiksmīgi rakstām tekstu tīmekļa lapā, izmantojot JavaScript:
2. metode: dinamiski rakstiet HTML kodu, izmantojot iekšējo HTML rekvizītu
Lai dinamiski rakstītu HTML kodu, izmantojiet JavaScript ' innerHTML ” īpašums. Tā ir vienkāršākā pieeja HTML elementa satura maiņai. Tā atbalsta visas pārlūkprogrammas.
Sintakse
Izpildiet norādīto sintakse, lai izmantotu innerHTML rekvizītu:
innerHTML = 'teksts'Piemērs
HTML failā vispirms izveidojiet pogu, kas izsauks definēto funkciju ' virsraksts () ” JavaScript par klikšķa notikumu:
< pogu onclick = 'virsraksts()' > Noklikšķiniet šeit pogu >Izmantojot tagu
, izveidojiet rindkopu, kurā tiks parādīts teksts no JavaScript, un piešķiriet tai ID:
< p id = 'virsraksts' > lpp >Definējiet funkciju ' virsraksts () ” JavaScript failā. Iegūstiet atsauci uz HTML elementu, izmantojot tam piešķirto ID, izmantojot “ getElementById() ' metodi un izmantojiet ' innerHTML ” īpašums uz tā:
funkcijas virsraksts ( ) {dokumentu. getElementById ( 'virsraksts' ) . innerHTML = '
Laipni lūdzam Linuxhint
' ;}
Izvade
Mēs esam apkopojuši visu būtisko informāciju, kas saistīta ar HTML koda dinamisku rakstīšanu, izmantojot JavaScript.
Secinājums
Lai dinamiski rakstītu HTML kodu JavaScript, izmantojiet ' document.createElement() ' metode ar ' teksta saturs 'īpašums vai ' innerHTML ” īpašums. Pirmajā metodē jums nav nepieciešams HTML kods, savukārt iekšējā HTML rekvizītā jums ir jāpiekļūst HTML elementam un jāveic darbība ar to. Šajā apmācībā mēs aprakstījām metodes, kā dinamiski rakstīt HTML kodu, izmantojot JavaScript.