Когда я начал работать с JavaScript, одной из моих главных проблем было «Как очистить часть страницы и отобразить другой контент», тогда я начал искать способ сделать это, позвольте мне представить вам способ, который я нашел для очистки страницы, которая в основном удаляет основной дочерний элемент div.
Прежде всего, нам нужно создать базовый HTML-скеллетон с div, как показано ниже:
‹html›
‹голова›‹голова›
‹div id="основной контейнер"› ‹/div›
‹script src="index.js"›‹/script›
‹/html›
Затем мы должны получить этот div по идентификатору со следующей строкой в нашем файле JavaScript:
const mainContainer = document.getElementById («основной контейнер»);
У нас уже есть данные div, поэтому теперь мы можем создать новый div и поместить его внутрь с содержимым:
const div = document.createElement («div»);
mainContainer.appendChild(div);
div.innerHTML = «‹span›Hello World‹/span›»;
Он создаст div и поместит его внутрь основного контейнера, на странице отобразится Hello World, и если вы осмотрите страницу и проверите html-скелетон, вы увидите, что у основного контейнера есть дочерний элемент, но его нет в html файле, потому что мы создаем его с помощью JavaScript.
Теперь давайте создадим еще один div с другим текстом:
const div = document.createElement («div»);
mainContainer.appendChild(div);
div.innerHTML = «‹span›Изменить статус‹/span›»;
Если мы хотим очистить наш основной контейнер и отобразить другой текст, мы должны удалить дочерний элемент нашего div с помощью следующей функции:
function clear (контейнер) { while (container.firstChild) { container.removeChild (container.firstChild); }}
Мы должны передать в качестве аргумента наш основной контейнер и запустить функцию, и она удалит дочерний элемент нашего div, а затем мы сможем добавить новый div и отобразить другой контент:
очистить (основной контейнер);
