jquery - 添加带有 span 标签的数组键

Question

我有一个像这样的数组:

var totalNum = new Array('img', 'img', 'img', 'img');

现在在 documentready我添加了div在 html 页面中，例如:

$('#mainid').after('<div id="button"></div>');

问题是我想添加 <span></span>标签总数为 totalNum数组如:

<div id="button">
   <span>1</span>
   <span>2</span>
   <span>3</span>
   <span>4</span>
</div>

我尝试过 for(){}循环进入.after()但出现语法错误。我的代码在这里:

jQuery('#mainid').after('<div id="button">' + 
        for(i=1;i<=totalNum.length;i++){
    jQuery('<span>'+i+'</span>').appendTo('#button');
}
    + '</div>');

Answer 1

不能在字符串连接中间抛出 for 循环。

var button = $('#button');

$.each(totalNum, function(index) {
    $('<span />', { text: index + 1 }).appendTo(button);
});

我相信这有一些好处，例如......

• 不强制浏览器解析 HTML。
• 缓存对目标元素#button的引用。
• $.each() 对我来说比显式的 for 循环更优雅。