jQuery 遍歷 img 數組的正確姿勢：eq() 選擇器 vs each() 隱式迭代

錯誤代碼分析

var images = new Array();
var length = $('.upload_append_list').find('img').length;
for (var i = 0; i < length; i++) {
    // 錯誤 1：var 重複聲明
    // 錯誤 2：[i] 返回原生 DOM，失去 jQuery 方法
    // 錯誤 3：$j 未定義
    var images[i] = $j(".upload_append_list").find("img")[i].attr("src");
}

方案一：jQuery eq() 選擇器（保留索引語義）

var images = [];
var $imgs = $('.upload_append_list img');
var len = $imgs.length;
for (var i = 0; i < len; i++) {
    images[i] = $imgs.eq(i).attr('src'); // eq(i) 返回 jQuery 對象
    console.log(images[i]);
}

方案二：each() 隱式迭代（更推薦，代碼更少）

var images = [];
$('.upload_append_list img').each(function() {
    images.push($(this).attr('src'));
});
console.log(images); // 已是完整數組

方案三：map() 函數式風格（一行搞定）

var images = $('.upload_append_list img').map(function() {
    return $(this).attr('src');
}).get(); // .get() 轉為原生數組

核心知識點

• `$('[selector]')[i]` → **原生 DOM 元素**，無 jQuery 方法。
• `$('[selector]').eq(i)` → **jQuery 對象**，鏈式調用安全。
• `each()` 回調中 `this` 是原生 DOM，`$(this)` 才是 jQuery。
• **不要在循環中重複聲明 `var`**，陣列直接 `push` 或索引賦值即可。