如何评估jQuery append中的javascript变量

How to evaluate javascript variable inside jQuery append?

本文关键字：append 中的 javascript 变量 jQuery 何评估 评估      更新时间：2023-09-26

我有一个对象数组（array），每个对象都有一个包含路由到图像的URL字符串的属性。我正在尝试使用jQuery循环遍历这个数组，并将每个对象的图像附加到div中。这是我的代码：

for (var i = 0; i < array.length; i++) {
    $('#div').append("<img src='"array[i].URL'" alt='"pic'">");
}

注意：我使用了反斜杠来转义img标记中的引号。

javascript没有在append方法内部进行计算，它只是在页面上打印图像地址的"array[i].URL"。

有人能提醒我在这里做错了什么吗？

您有很多选择：

  1. $()和attr:

    for (var i = 0; i < array.length; i++) {
    $('#div').append(
        $('<img alt="pic">').attr("src", array[i].URL)
    );
}

  2. 字符串串联：

    for (var i = 0; i < array.length; i++) {
    $('#div').append(
        '<img src="' + array[i].URL + '" alt="pic">'
    );
}

  3. 在ES2015+中，您有模板字符串：

    for (var i = 0; i < array.length; i++) {
    $('#div').append(
        `<img src="${array[i].URL}" alt="pic">`
    );
}

    注意${和}—它们之间的比特由JavaScript引擎进行评估，并在该点进行交换。还要注意，它们是用反引号引用的，而不是单引号或双引号。

相关文章：