在大量的div（最好的方法）

Question

的插入圖片來源於是我在HTML做出了架& CSS：

<div id="achterkant"> 
    <div class="rack"> 
    <div class="rackRow"> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
    </div> 
    <div class="rackRow"> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
    </div> 
    <div class="rackRow"> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
    </div> 
    <div class="rackRow"> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
    </div> 
    <div class="rackRow"> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
    </div> 
    <div class="rackRow"> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
     <div class="rackSlot"></div> 
    </div> 
    </div> 
</div> 

在所有這些rackSlots需要有一個像我從我的API得到（只是一個鏈接）。我有這些數組。有沒有辦法只是插入第一個div與類rackslot的圖像，它沒有圖像？ 這是我覺得我應該這樣做：

for (i = 0; i < 36; i++){ 
     $('first rack slot with no images').prepend('<img src="'myarrayofimages[i]'"/>'); 
    } 

Answer 1

首先，請注意您的字符串連接是有缺陷的 - 你錯過了+加盟值。

達到你需要，你可以使用:empty:first選擇所需.rackSlot元素是什麼：

for (i = 0; i < 36; i++){ 
    $('.rackSlot:empty:first').prepend('<img src="' + myarrayofimages[i] + '"/>'); 
} 

如果你想讓它更確切的一點，你可以明確地檢查它不包含img元素：

for (i = 0; i < 36; i++){ 
    $('.rackSlot:not(:has(img)):first').prepend('<img src="' + myarrayofimages[i] + '"/>'); 
}