javascript - 给定一个预定义的变量，我如何在 jQuery 中计数到一定数量

Question

我在函数中定义了一个变量，该变量存储标签中“数据”属性提供的值。

即<img data-value="##"/> (## 表示 1 - XX 之间的数字)。

我已经这样存储了这个变量:

$dataValue = $('img').attr('data-value');

我现在想使用 $dataValue附加所有 <img> 的变量具有所有值的标签。例如，假设数据值为 4，输出将是:

<img src="http://placehold.it/50x50?text=1" />
<img src="http://placehold.it/50x50?text=2" />
<img src="http://placehold.it/50x50?text=3" />
<img src="http://placehold.it/50x50?text=4" />

到目前为止，我已经完成了以下操作，但我无法找到一种方法来增加数字“4”(或数据值的任何数字)并按递增顺序吐出 4 个图像标签，如图所示多于。

var img = '<img src="http://placehold.it/50x50?text=' + $dataValue + '" />';

// <img src="http://placehold.it/50x50?text=4" />

我如何实现上面的输出，以便记录从 1 开始的所有数字，直到数据值数字。我想使用它们将这些标签附加到另一个地方。

Answer 1

基础 loop就是你需要的一切

var dataValue = $('img').data('value');
for (i = 1; i <= dataValue; i++) {
    $('.container').append('<img src="http://placehold.it/50x50?text=' + dataValue + '" />')
} 

其中 $('.container') 是您要附加图像的元素的名称。

此外，我建议您使用 .data() 而不是 .attr() 获取数据值 .data()就是为此而生。

另外请记住，.append() 可以更改为其他方法，例如 .before()、.after() , .prepend() 等。我建议您阅读所需的方法。