嗨，我想弄清楚如果 img src 為空，如何洗掉 div。
我在stackoverflow上搜索過，但大多數都是基于jq的。有人可以幫助使用香草 javascript 嗎？
<div class="swiper-wrapper ">
<div class="swiper-slide">
<img
src="https://images.unsplash.com/photo-1526947425960-945c6e72858f?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxzZWFyY2h8MTN8fHByb2R1Y3RzfGVufDB8fDB8fA==&w=1000&q=80"
alt=""
class="imgCard"
color=""
/>
</div>
<div class="swiper-slide">
<img
src=""
alt=""
class="imgCard"
color=""
/>
</div>
</div>
uj5u.com熱心網友回復：
在這里你可以如何做到這一點
const swipers = document.querySelectorAll('.swiper-slide');
swipers.forEach(e => {
const imgSource = e.querySelector('img').getAttribute('src');
if (imgSource.trim() === '') {
e.remove()
}
})<div class="swiper-wrapper ">
<div class="swiper-slide">
<img src="https://images.unsplash.com/photo-1526947425960-945c6e72858f?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxzZWFyY2h8MTN8fHByb2R1Y3RzfGVufDB8fDB8fA==&w=1000&q=80" alt="" class="imgCard" color="" />
</div>
<div class="swiper-slide">
<img src="" alt="" class="imgCard" color="" />
</div>
</div>uj5u.com熱心網友回復：
您可以獲取所有屬于.swiper-slide類的子影像并檢查它們的src屬性是否不同于像這樣的空字串
let imgs = document.querySelectorAll(".swiper-slide img");
imgs.forEach(item => {
if (item.getAttribute('src') === "") {
item.parentNode.remove();
}
});<div class="swiper-wrapper ">
<div class="swiper-slide">
<img src="https://images.unsplash.com/photo-1526947425960-945c6e72858f?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxzZWFyY2h8MTN8fHByb2R1Y3RzfGVufDB8fDB8fA==&w=1000&q=80" alt="First image alternate text" class="imgCard" color="" />
</div>
<div class="swiper-slide">
<img src="" alt="Second image alternate text" class="imgCard" color="" />
</div>
</div>uj5u.com熱心網友回復：
myImgs = document.getElementsByClassName('imgCard');
for (i = 0; i < myImgs.length; i ) {
if (myImgs[i].src == '') {
myImgs[i].parentNode.style.display = 'none';
}
}<div class="swiper-wrapper ">
<div class="swiper-slide">
<img src="https://images.unsplash.com/photo-1526947425960-945c6e72858f?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxzZWFyY2h8MTN8fHByb2R1Y3RzfGVufDB8fDB8fA==&w=1000&q=80" alt="" class="imgCard" color="" />
</div>
<div class="swiper-slide">
<img src="" alt="" class="imgCard" color="" />
</div>
</div>在上面的代碼中，我們首先使用getElementsByClassName()函式獲取所有影像。
這個函式回傳一個陣列，我們使用 for 回圈進行迭代。
在 for 回圈中，我們通過將其顯示設定為隱藏父元素 (div none)不推薦，如果你愿意，你仍然可以把它帶回來。
希望能解決你的問題，謝謝！
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/416446.html
標籤：
上一篇：CSS單行影片