Овај водич ће описати методе за динамичко писање ХТМЛ кода користећи ЈаваСцрипт.
Како писати ХТМЛ код динамички користећи ЈаваСцрипт?
Да бисте написали ХТМЛ код користећи ЈаваСцрипт, користите следеће методе:
Метод 1: Динамички напишите ХТМЛ код користећи метод доцумент.цреатеЕлемент()
ЈаваСцрипт-ов „ доцумент.цреатеЕлемент() ” метод са „ тектЦонтент ” својство се користи за динамичко писање ХТМЛ кода у ЈаваСцрипт-у. Користећи методу цреатеЕлемент(), можете креирати одређени ХТМЛ елемент, а својство тектЦонтент се користи за постављање текстуалног садржаја.
Синтакса
Користите дату синтаксу да направите ХТМЛ елемент у ЈаваСцрипт-у:
документ. цреатеЕлемент ( 'Означи име' )
Пример
Овде ћемо прво направити пасус у ЈаваСцрипт датотеци користећи ХТМЛ <п> ознаку прослеђену у „ цреатеЕлемент() ” метод:
конст текст = документ. цреатеЕлемент ( 'п' ) ;Користите својство тектЦонтент да поставите текст у параграфу:
текст. тектЦонтент = „Добро дошли у Линукхинт“ ;
На крају, одштампајте текст на веб страници користећи „ доцумент.врите() ” метод:
документ. писати ( текст. тектЦонтент ) ;Овде можете видети у излазу да смо успешно написали текст на веб страници користећи ЈаваСцрипт:
Метод 2: Пишите ХТМЛ код динамички користећи својство иннерХТМЛ
Да бисте писали ХТМЛ код динамички, користите ЈаваСцрипт “ иннерХТМЛ ' имовина. То је најједноставнији приступ промени садржаја ХТМЛ елемента. Подржава све претраживаче.
Синтакса
Пратите дату синтаксу да бисте користили својство иннерХТМЛ:
иннерХТМЛ = 'текст'Пример
У ХТМЛ датотеци прво направите дугме које ће позвати дефинисану функцију „ наслов() ” у ЈаваСцрипт-у на догађај клика:
< дугме онцлицк = 'хеадинг()' > Кликните овде дугме >Направите пасус помоћу ознаке <п> где ће се текст приказати из ЈаваСцрипт-а и доделите му ИД:
< п ид = 'наслов' > стр >Дефинишите функцију ' наслов() ” у ЈаваСцрипт датотеци. Добијте референцу ХТМЛ елемента користећи додељени ИД уз помоћ „ гетЕлементБиИд() ” метод и применити „ иннерХТМЛ ” власништво на њему:
наслов функције ( ) {документ. гетЕлементБиИд ( 'хеадинг' ) . иннерХТМЛ = „<х1>Добро дошли у Линукхинт“ ;
}
Излаз
Сакупили смо све битне информације везане за писање ХТМЛ кода динамички користећи ЈаваСцрипт.
Закључак
Да бисте писали ХТМЛ код динамички у ЈаваСцрипт-у, користите „ доцумент.цреатеЕлемент() ” метод са „ тектЦонтент “ својство или “ иннерХТМЛ ' имовина. У првом методу вам није потребан никакав ХТМЛ код, док у својству иннерХТМЛ морате приступити ХТМЛ елементу и извршити операцију на њему. У овом водичу описали смо методе за динамичко писање ХТМЛ кода користећи ЈаваСцрипт.