动态修改HTML元素属性失败：页面加载未更新内容求助

1. 数据函数直接返回undefined #

你的products()函数里，return后面直接换行了，JS会自动在return后加个分号，导致函数根本返回不了你定义的数组，只会返回undefined。

改完的data.js：

export function products() {
    return [
        {
            "id": "1001",
            "name": "MG RX-78-2 3.0",
            "scale": "1/100",
            "comp": "Bandai",
            "price": "1,350,000 đ",
            "type": "MG",
            "status": 1,
            "poster": "https://cdn.shopify.com/s/files/1/2786/5582/products/mg-rx-78-2-gundam-ver-3-0-pa_1.jpg?v=1660244450"
        }
    ];
}

2. 生成函数写了但没执行 #

你在页面就绪的回调里定义了products_gen函数，但没调用它，页面加载时自然不会触发替换逻辑，必须手动调用一次。

3. 数组length是属性不是方法 #

代码里写的product_list.length()是错的，数组长度是属性，直接写product_list.length就行。

4. 产品数量不够会卡死循环 #

现在只有1个产品，但你要循环生成8个不同项，这会导致无限循环——唯一的产品被选中后，后面随机出来的索引永远是它，满足不了未选中的条件，i永远涨不到8。要么限制生成数量不超过现有产品数，要么允许重复展示。

修复后的main.js（先按现有1个产品处理，后续加产品后自动适配）：

import { products } from "./data.js";
(function ($) {
    "use strict";
    $(document).ready(function () {
        function products_gen() {
            let product_list = products();
            // 最多展示现有产品数，避免死循环
            const maxItems = Math.min(8, product_list.length);
            let check = new Array(product_list.length).fill(false);
            
            for(let i = 0; i < maxItems; ){
                let rando = Math.floor(Math.random() * product_list.length);
                if(!check[rando]){
                    check[rando] = true;
                    // 注意：如果要生成多个产品卡片，不能一直用同一个id，得按索引拼接id，比如products_${i+1}_poster
                    // 这里先处理第一个产品项的情况
                    document.getElementById("products_1_poster").src = product_list[rando].poster;
                    document.getElementById("products_1_name").innerHTML = product_list[rando].name;
                    document.getElementById("products_1_price").innerHTML = product_list[rando].price;
                    i++;
                }
            }
        }
        // 调用生成函数，页面加载时执行
        products_gen();
    });   
})(jQuery);

额外提醒：如果要生成多个不同的产品卡片，别一直给同一个id赋值，得根据循环索引动态匹配对应的DOM元素，比如把元素id设成products_1_poster、products_2_poster这类，循环时用i来拼接id，不然所有循环都会覆盖同一个元素的内容。

内容的提问来源于stack exchange，提问作者Dung Tran