<img class="clothes__img swap-main " id="img__hover " src="https://picsum.photos/id/1/300/200" alt="">
<h5 class="clothes__caption">Women's tracksuit Q109</h5>
<div class="clothes__info">
<p class="clothes__price">$ 38.00</p>
<form class="form form_margin">
<div class="form__item">
<div data-ajax="true" class="rating rating_set">
<div class="rating__body">
<div class="rating__active"></div>
<div class="rating__items">
<input type="radio" class="rating__item" name="rating" value="1">
<input type="radio" class="rating__item" name="rating" value="2">
<input type="radio" class="rating__item" name="rating" value="3">
<input type="radio" class="rating__item" name="rating" value="4">
<input type="radio" class="rating__item" name="rating" value="5">
</div>
</div>
<div class="rating__value">3.6</div>
</div>
</div>
</form>
</div>
<div class="hover__block" id="di2">
<div class="hover__iner onlyOne">
<img class="iner__img swap-img" src="https://picsum.photos/id/1/300/200" alt="">
<img class="iner__img swap-img" src="https://picsum.photos/id/7/300/200" alt="">
<img class="iner__img swap-img" src="https://picsum.photos/id/12/300/200" alt="">
<img class="iner__img swap-img" src="https://picsum.photos/id/22/300/200" alt="">
</div>
</div>
данный код не работает так, как на 3 строке js не видит swap-main
```
document.querySelectorAll('.swap-img').forEach(e => {
e.addEventListener('click', function(ev) {
ev.target.closest('.swap-main').src = ev.target.src
})
})
```
closest
ищет ближайшего предка по цепочке вверх от родителя к родителю, а у Вас элемент<img class="clothes__img swap-main">
находится на одном уровне иерархии с родителем родителя элемента<img class="iner__img swap-img"
, поэтому в данном случаеclosest
не сработает.