Блог

Главная - Вопросы по программированию - почему мой предыдущий результат не очищается при отправке нового поиска?

почему мой предыдущий результат не очищается при отправке нового поиска?

#javascript #asynchronous #axios #addeventlistener #omdbapi

#javascript #асинхронный #axios #addeventlistener #omdbapi

Вопрос:

Я пытаюсь печатать новый результат каждый раз при поиске, но результат продолжает добавляться после предыдущего, я хочу очистить предыдущий результат и отобразить новые результаты при eventListener отправке. Вот мой код javascript:

 const form = document.querySelector("#searchForm")
const icon = document.querySelector("#tvIcon")
form.addEventListener("submit", async(event)=>{
event.preventDefault();
    const search = form.elements.query.value;
    const config = {params: {q: search}}
    const res = await axios.get("http://api.tvmaze.com/search/shows", config)
    // console.log(res.data)
    makeImages(res.data);
    form.elements.query.value = "";
});

const makeImages = (show)=>{
    let tvPics = document.querySelector("#tvImages")
    for(let result of show){
    if(result.show.image){
    let img = document.createElement("IMG");
    img.src = result.show.image.medium;
    tvPics.append(img)
    } 
    }
};

Комментарии:

1. Потому что вы добавляете, а не удаляете или заменяете… developer.mozilla.org/en-US/docs/Web/API/ParentNode/append

2. @Michael Можете ли вы предоставить более четкий контекст для этого?

3. Попробуйте вызвать tvPics.innerHTML = '' перед вашим циклом for внутри makeImages через developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML

4. @Dominik большое тебе спасибо, я только что добавил это, и это сработало, я ценю это, чувак