如何通过jQuery添加divs网络？

Question

您好，我为Web浏览器执行了拼字游戏。

我需要做的是为字符添加div的净值，因此输出效果应该像这样：

 <div id="a1"></div> <div id="a2"></div>  <div id="a3"></div>  <div id=a4"></div>    <div id="a4"></div>  
 <div id="b1"></div>  <div id="b2"></div>  <div></div>  <div></div>  <div></div>  
 <div></div>  <div></div>  <div></div>  <div></div>  <div></div>  
 <div></div>  <div></div>  <div></div>  <div></div>  <div></div>  
 <div></div>  <div></div>  <div></div>  <div></div>  <div></div> 

我想知道如何在jquery中实现类似的东西，我通过loop中的append方法尝试了它：

( var i =  0 ; i < 15; i++)
    {
     $("#droppable").append("<div></div>")....
    }

但是我的潜水互相替换了...

更改CSS并不会带来结果。

你能帮助我吗 ？ 最好的创造网络的方式是什么？ 也许最好的选择就是简化它，我的意思是手动:(？

Answer 1

这可能会让您入门：

更新了x2 jsFiddle演示

var aAlpha = ['a','b','c','d','e','f','g','h','i','j','k','l','m','n','o'];
var aNum = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15];
var grid='';

for ( var i=0; i<15; i++) {
    grid += '<div class="hrow">';
    for (var j=0; j<15; j++) {
        grid += '<div class="grid" id="' +aAlpha[i]+aNum[j]+ '"></div>';
    }
    grid += '</div><br>';
}

$('#droppable').html(grid);