Для примера, есть пустая страница на html, кроме тега script на ней ничего нет. Подскажите как создать на ней блок или абзац. Только vanilla пожалуйста.
// var YourVarriableName = document.createElement("ElementWhatYouNeed");
// YourVarriableName.textContent = "YourSomeTextForTheElement";
// document.body.appendChild(YourVarriableName);
var block = document.createElement("div");
block.textContent = "Блок";
document.body.appendChild(block);
var paragraph = document.createElement("p");
paragraph.textContent = "Параграф";
document.body.appendChild(paragraph);
Для создания элементов можно воспользоваться методом document.createElement.
Данный метод принимаем имя элемента, который нужно создать и возвращает созданный элемент.
Для того, чтобы элемент отобразился на странице, его нужно добавить в один из элементов, которые уже есть. Например в элемент body.
Добавить можно с помощью метода .appendChild
Пример:
document.body.appendChild(document.createElement('div'));
div {
width: 100px;
height: 100px;
border: 1px solid red;
}
Альтернативным вариантом может стать вставка html строки, с помощью свойства innerHTML, либо метода insertAdjacentHTML
document.body.innerHTML = `<p class="d">1</p>`;
document.body.insertAdjacentHTML('beforeend', `<div class="d2">2</div>`);
.d {
background-color: green;
}
.d2 {
background-color: red;
}
Основные этапы разработки сайта для стоматологической клиники
Продвижение своими сайтами как стратегия роста и независимости