javascript - innerHTML 没有更新

Question

我正在尝试从字符串中获取数据，并且想将其显示在我的 html 中。

这是我尝试过的代码

var jsn = {
        "channels": [{
            "name": "video1",
                "image": "images/bodyguard.jpg"
        }, {
            "name": "video2",
                "image": "images/bodyguard.jpg"
        }, {
            "name": "video3",
                "image": "images/bodyguard.jpg"
        }, {
            "name": "video4",
                "image": "images/bodyguard.jpg"
        }, {
            "name": "video5",
                "image": "images/bodyguard.jpg"
        }]
    };
    var id = document.getElementById("menu_list");
    var inHtm = "";
    var channels = jsn.channels.length;
    var cha = jsn.channels;
    alert("channels : " + channels);

    if (channels != undefined) {
        for (var i = 0, len = channels; i < len; ++i) {
            var item = cha[i].name;
            alert(item);
            //var name = item.name;
            var image = cha[i].image;

            inHtm += '<div class="menu"><a href="javascript:void(0);" onkeydown="Main.keyDown();" >';

            inHtm += '<img src="' + image + '"/>';
            inHtm += '</a></div>';
        }
        alert(inHtm);
        in1.innerHtml = inHtm;
    }

My Fiddle

它正在将值分配给inHtm，但我的innerHTML 没有更新。我想在我的 html 中显示图像

Answer 1

这个:

 in1.innerHtml = inHtm;

应该是:

 id.innerHTML = inHtm;

您的对象是 id 而不是 in1，属性是 innerHTML 而不是 innerHtml。

此外，我建议使用 console.log() 进行调试，而不是 alert()。警报非常痛苦，尤其是在循环中，并且使用 console.log() 您可以转储整个对象，而警报只会显示“对象”。

Corrected fiddle