Šiame vadove bus aprašyti metodai, kaip dinamiškai rašyti HTML kodą naudojant JavaScript.
Kaip dinamiškai parašyti HTML kodą naudojant „JavaScript“?
Norėdami parašyti HTML kodą naudodami „JavaScript“, naudokite šiuos metodus:
1 būdas: dinamiškai parašykite HTML kodą naudodami document.createElement() metodą
„JavaScript“ document.createElement() “ metodas su „ teksto Turinys ypatybė naudojama dinamiškai rašyti HTML kodą JavaScript. Naudodami createElement() metodą, galite sukurti tam tikrą HTML elementą, o teksto turiniui nustatyti naudojama ypatybė textContent.
Sintaksė
Norėdami sukurti HTML elementą „JavaScript“, naudokite nurodytą sintaksę:
dokumentas. sukurtiElementą ( 'tagName' )
Pavyzdys
Pirmiausia sukursime pastraipą „JavaScript“ faile naudodami HTML
žymą, perduotą „ sukurti elementą () “ metodas:
konst tekstą = dokumentas. sukurtiElementą ( 'p' ) ;Norėdami nustatyti tekstą pastraipoje, naudokite ypatybę textContent:
tekstą. teksto Turinys = „Sveiki atvykę į Linuxhint“ ;
Galiausiai išspausdinkite tekstą tinklalapyje naudodami „ document.write() “ metodas:
dokumentas. rašyti ( tekstą. teksto Turinys ) ;Čia galite pamatyti išvestyje, mes sėkmingai rašome tekstą tinklalapyje naudodami JavaScript:
2 būdas: dinamiškai parašykite HTML kodą naudodami vidinę HTML ypatybę
Norėdami dinamiškai rašyti HTML kodą, naudokite „JavaScript“ vidinis HTML ' nuosavybė. Tai paprasčiausias būdas pakeisti HTML elemento turinį. Jis palaiko visas naršykles.
Sintaksė
Norėdami naudoti vidinę HTML nuosavybę, vadovaukitės nurodyta sintaksė:
vidinis HTML = 'tekstas'Pavyzdys
Pirmiausia HTML faile sukurkite mygtuką, kuris iškvies apibrėžtą funkciją ' Antraštė() “ JavaScript spustelėjimo įvykyje:
< mygtukas onclick = 'Antraštė()' > Paspauskite čia mygtuką >Sukurkite pastraipą naudodami
žymą, kurioje bus rodomas tekstas iš „JavaScript“, ir priskirkite jai ID:
< p id = 'Antraštė' > p >Apibrėžkite funkciją ' Antraštė() “ JavaScript faile. Gaukite HTML elemento nuorodą naudodami jam priskirtą ID naudodami „ getElementById() “ metodą ir pritaikykite „ vidinis HTML “ turtas ant jo:
funkcijos antraštė ( ) {dokumentas. getElementById ( 'Antraštė' ) . vidinis HTML = '
Sveiki atvykę į Linuxhint
' ;}
Išvestis
Surinkome visą esminę informaciją, susijusią su dinamišku HTML kodo rašymu naudojant JavaScript.
Išvada
Norėdami dinamiškai rašyti HTML kodą „JavaScript“, naudokite „ document.createElement() “ metodas su „ teksto Turinys “ nuosavybė arba “ vidinis HTML ' nuosavybė. Pirmuoju metodu jums nereikia jokio HTML kodo, o vidinėje HTML nuosavybėje turite pasiekti HTML elementą ir atlikti su juo operaciją. Šioje pamokoje aprašėme HTML kodo dinaminio rašymo naudojant „JavaScript“ metodus.