Пригадаймо об'єктну модель документа (DOM). За її допомогою ми можемо чітко ідентифікувати об'єкти та елементи вебсторінки.


За допомогою команди appendChild - додаємо дочірній елемент, задаємо йому ідентифікатор та необхідні стильові властивості.


var new_header=document.createElement("h2");

document.body.appendChild(new_header);

new_header.innerHTML="Нові можливості!";

new_header.style.color = "green"; 


Новоствореному (або й початково існуючому) елементу можна призначити команди за допомогою методу addEventListener (буквально - додаємо очікування події).


Подія (додаємо очікування події для елемента new_header)

new_header.addEventListener("click", smile);

Обробник події (прописуємо функцію в JS)

function smile() {

  this.style.border = "4px solid red";

}


Елементи на вебсторінці можна й видаляти командою 

this.remove()


Last modified: Sunday, 27 August 2023, 1:14 PM