Блог

Главная - Вопросы по программированию - Привет! Я хочу удалить все дивы внутри контейнера за один раз. Как я могу это сделать без какого-либо класса или идентификатора внутренних дивов?

Привет! Я хочу удалить все дивы внутри контейнера за один раз. Как я могу это сделать без какого-либо класса или идентификатора внутренних дивов?

#javascript #html #dom #removechild #parent-node

Вопрос:

Я создал форму для поиска вещей и добавил их в качестве div в контейнер. Теперь для каждого нового поиска я хочу, чтобы все дивы из контейнера удалялись. Как мне это сделать?

 const container = document.querySelector('.container');
const form = document.querySelector('#search-form');
form.addEventListener('submit', async function(e) {
  e.preventDefault();
  clear();
  const searchTerm = form.elements.query.value;

  const config = {
    params: {
      q: searchTerm
    }
  }
  const res = await axios.get(`http://api.tvmaze.com/search/shows`, config);
  displayShows(res.data);

  form.elements.query.value = '';
})

function clear() {
  for (div in container) {
    div.remove();
  }
} 
 <form id="search-form">
  <input type="text" placeholder="TV Show Title" name="query">
  <button id="search-btn">Search</button>
</form>

<div class="container">
  <div>Here is div-01</div>
  <div>Here is div-02</div>
  <div>Here is div-03</div>
</div>

Ответ №1:

Если вы хотите удалить все разделители в контейнере (при условии, что вы создаете каждый из них снова при запуске displayShows()):

Вместо clear () сделайте это:

 container.innerHTML = ''

Это приведет к удалению всего, что находится внутри контейнера div, включая теги.

Ответ №2:

Вы можете удалить свои дивы, используя что-то вроде этого ниже

   var e = document.getElementById("you_might_want_a_unique_id");
  var divs = e.querySelectorAll("div");
  for(var i=0;i < divs.length;i   )
    e.removeChild(divs[i]);

Просто добавьте атрибут id в свой контейнер (если у вас несколько контейнеров).

 <div id="you_might_want_a_unique_id" class="container">
Метки: