追加圖像jQuery的不工作

Question

我要附加到使用jQuery一個div圖像的div和我的代碼如下所示：

$(".contentdiv")[div].append('<img src="china.jpg" class="contentimg">') 

這並不返回錯誤，但不顯示圖像。當我刪除[div]迭代器時，它確實有效，但我不想這樣做，因爲我將來可能會爲不同的contentdivs使用不同的圖像。 問題是不是在[DIV]雖然，因爲

$(".contentdiv")[div].style.marginLeft = 30px 

工作正常。

Answer 1

您需要針對jQuery對象在不同contentdiv不同的圖像追加，不僅集合中返回的元素。 @jafarbtech有一個很好的解決方案，但你也可以只是包裝你現在有什麼$()創建一個對象出來，所以你可以用$.append()

var div = 1; 
 
$($(".contentdiv")[div]).append('<img src="http://kenwheeler.github.io/slick/img/fonz1.png" class="contentimg">'); 
 
$(".contentdiv")[div].style.marginLeft = '30px';

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="contentdiv"></div> 
 
<div class="contentdiv"></div> 
 
<div class="contentdiv"></div>

Answer 2

使用.eq()通過使用$(".contentdiv").eq(0).append('<img src="http://placehold.it/140x158" class="contentimg">');

$(".contentdiv").eq(0).append('<img src="http://placehold.it/140x158" class="contentimg">'); 
 
$(".contentdiv").eq(1).append('<img src="http://placehold.it/150x158" class="contentimg">'); 
 
$(".contentdiv").eq(2).append('<img src="http://placehold.it/160x158" class="contentimg">');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="contentdiv"> 
 
</div> 
 

 
<div class="contentdiv"> 
 
</div> 
 

 
<div class="contentdiv"> 
 
</div>