javascript - 使用 jquery 添加带有循环的 div 并将 div 设置为变量

Question

我对这种行为很好奇。为什么这只会创建一个div :

let text = 'some text';
let $div = $('<div></div>');
$div.text(text);
for (let x = 0; x < 5; x++) {
  $('article').append($div);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<article></article>

如果我将附加更改为 ("</div>" + text + '</div>');然后它创建了五个。似乎div在循环中被覆盖，但它不应该每次都附加一个新的吗？为什么会覆盖？

Answer 1

就像罗里提到的那样，您引用的是相同的 <div>循环开始之前创建的元素。要每次添加一个新的，您可以编写:

let text = 'some text';
for (let x = 0; x < 5; x++) {
  $('article').append('<div>' + text + '</div>');
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<article></article>

jQuery 的 append()用途非常广泛，它接受 :DOM 元素、文本节点、元素数组、HTML 字符串或 jQuery 对象。详情here 。