document.getElementsByClassName(）.inerHTML总是返回"未定义”;

document.getElementsByClassName().innerHTML always returns "undefined"

本文关键字：quot 未定义 返回 getElementsByClassName inerHTML document      更新时间：2023-09-26

我一定在某个地方犯了错误，所以document.getElementsByClassName().innerHTML总是返回未定义。

首先，我通过javascript:生成<li>

$('#list').append('<li class="box"><img class="picture" src="images/HotPromo/tagPhoto1.png"/><p class="name"><b>Name</b></p><p class="address">Address</p><p class="hidden"></p></li>');

注意，在最右边，我有一个<p>元素和hidden类。我用它来获得id，我不想向我的用户显示它。

这是在<li>:上生成数据的jQuery

$(".box").each(function () {
    var name, address, picture, id = "";
    if (i < result.length) {
        name = result[i].name;
        address = result[i].address;
        picture = result[i].boxpicture;
        id = result[i].mallid;
    }
    $(this).find(".name").html(name);
    $(this).find(".address").html(address);
    $(this).find(".picture").attr("src", picture);
    $(this).find(".hidden").html(id);
    i++;
});

我试过检查数据，它运行良好。

现在，假设我想在用户单击我上面生成的<li class="box">之一时提醒隐藏的id<p>：

$(".box").click(function () {
    alert(document.getElementsByClassName('hidden').innerHTML);
});

但是，此警报始终返回"未定义"。

document.getElementsByClassName()返回nodeList，而不是元素！

所以应该是：

document.getElementsByClassName('hidden')[0].innerHTML

由于您可能有更多的.hidden元素，并且只希望当前.box（在事件处理程序中为this）中有一个元素，

this.getElementsByClassName('hidden')[0].innerHTML

但是为什么不jQuery

$(".box").click(function(){
        alert( $('.hidden', this).html() );
});
相关文章：