Очистить элемент HTML с помощью JavaScript

Чтобы очистить элемент HTML с помощью JavaScript, вы можете использовать несколько методов. Вот несколько часто используемых подходов:

  1. Метод InnerHTML:
    Вы можете установить для свойства innerHTMLэлемента пустую строку. Это эффективно очищает содержимое элемента.

    document.getElementById("elementId").innerHTML = "";
  2. Метод TextContent/InnerText:
    Если вы хотите удалить только текстовое содержимое элемента, сохранив при этом все дочерние элементы, вы можете использовать textContentили innerTextи задайте для него пустую строку.

    document.getElementById("elementId").textContent = "";
    // OR
    document.getElementById("elementId").innerText = "";
  3. Метод RemoveChild:
    Если вы хотите удалить все дочерние элементы из родительского элемента, вы можете использовать метод removeChildв цикле до тех пор, пока не останется дочерних узлов.

    var element = document.getElementById("elementId");
    while (element.firstChild) {
     element.removeChild(element.firstChild);
    }
  4. Метод OuterHTML:
    Если вы хотите удалить весь элемент из DOM, включая сам элемент и его содержимое, вы можете использовать свойство outerHTMLи установить для него значение пустая строка.

    var element = document.getElementById("elementId");
    element.outerHTML = "";

Это некоторые из распространенных методов очистки HTML-элемента с помощью JavaScript.