javascript - html-javascript追加无效

Question

我有这个 javascript 在我的 html 页面上添加图像，这里：

<script>
    var img = new Image();
    let filename = 'IMG20191106172456.jpg'
    img.src = "img/" + filename;
    $("row first").append("<li><img src='" + "img/" + filename + "'></li>");
    console.log(img.src);
</script>

完整的 html

但问题是它没有渲染任何东西，这里是现场

正在渲染的前三个图像来自这里。它甚至给我的 html 带来了变化。

我的目标是最后再次渲染第一张图像。

标签： javascripthtml

Answer 1

您的 jquery 选择器以元素为目标，后跟 <row>元素<first>。我假设，从完整的 html，这不是你想要的。您想改为以类为目标，因此如果您将代码更改为

$(".row.first").append(..)

它应该工作。

另外，请注意我删除了两个类名之间的空格。这是必需的，因为它们都应用于同一个 html 元素，而选择器中的空格表示下一个类应该在子元素上。

您还需要将代码包装在

$(function(){ 
   /* Your code goes here. */ 
});

为了确保在您的 javascript 执行之前呈现 HTML。