我有一个字符数组，我想使用 javascript 在 html 中以 4 行的形式显示名称、房屋和图像。 我是foreach吗？

Question

tried something like this potterCharacters.forEach((x) => getCharacters(x.name)); This displays the name only but cant seem to go on with it.

function Init()
{
    debugger;
    potterCharacters.forEach((x) => getCharacters(x.name));
    text += "</ul>";
    document.getElementById("rows").innerHTML = text;    
}

function getCharacters(value)
{
    text += "<th>" + value + "</th>";
}```

Answer 1

function Init() {
    const text = potterCharacters.map(character => {
        const { name, house, image } = character
        return `<tr>
            <td>${name}</td>
            <td>${house}</td>
            <td><img src="${image}"/></td>
        </tr>`
    })
    document.getElementById("characters").innerHTML = text    
}

html:

<table id="characters"></table>

Answer 2

tried something like this potterCharacters.forEach((x) => getCharacters(x.name)); This displays the name only but cant seem to go on with it.

function Init()
{
    debugger;
    potterCharacters.forEach((x) => getCharacters(x.name));
    text += "</ul>";
    document.getElementById("rows").innerHTML = text;    
}

function getCharacters(value)
{
    text += "<th>" + value + "</th>";
}```