如何評估jQuery附加內的JavaScript變量？

Question

我有一個對象數組（array），每個對象都有一個包含路由到圖像的URL字符串的屬性。我試圖使用jQuery來遍歷這個數組，並將每個對象的圖像追加到div。這裏是我的代碼：

for (var i = 0; i < array.length; i++) { 
    $('#div').append("<img src=\"array[i].URL\" alt=\"pic\">"); 
} 

注意：我用反斜槓來轉義img標記中的引號。

javascript不會在append方法內進行評估，它只是在頁面上爲圖像地址打印「array [i] .URL」。

有人可以給我一個關於我在做什麼錯誤的提醒嗎？

Answer 1

你有一大堆的選擇：

1. $()和attr：

   for (var i = 0; i < array.length; i++) { 
       $('#div').append(
        $('<img alt="pic">').attr("src", array[i].URL) 
       ); 
   } 
   

2. 字符串連接：

   for (var i = 0; i < array.length; i++) { 
       $('#div').append(
        '<img src="' + array[i].URL + '" alt="pic">' 
       ); 
   } 
   

3. 在ES2015 +，你有template strings：

   for (var i = 0; i < array.length; i++) { 
       $('#div').append(
        `<img src="${array[i].URL}" alt="pic">` 
       ); 
   } 
   

   注意${和}   —中，它們之間是由JavaScript引擎評估，並在該點交換了一下。還要注意，它們被引用了反引號，而不是單引號或雙引號。