0

現在、このスクリプトはリストから単語を取得してグリッドを生成し、単語に毎回ランダムな位置を与えます。単語が生成されたら、それらを個々の文字に分割し、隣り合ったセルに分割して、単語が意味をなすようにしたいのですが、どうすればよいですか?

  var listOfWords = ["mat", "cat", "dog", "pit", "pot", "fog", "log", "pan", "can", "man", ];
 var shuffledWords = listOfWords.slice(0, 12);
 shuffledWords.sort(function () {
     return 0.5 - Math.random();
 });

 var table = $('<table class="tablestyle">');
 var rows = 6;
 var cols = 2;
 var tr;
 var index;

 for (var row = 0; row < rows; row++) {
     tr = $('<tr>');
     for (var col = 0; col < cols; col++) {
         index = (row * cols) + col;
         $('<td>').text(shuffledWords[index]).appendTo(tr);
     }
     tr.appendTo(table);
 }

 table.appendTo('body');

 $('<table>' + innerTable + '</table>').appendTo('body');
4

1 に答える 1

1

単語ごとに新しい行が必要で、単語内の文字には新しいセルが必要だと思いますか?

これを試して：

var listOfWords = ["mat", "cat", "dog", "pit", "pot", "fog", "log", "pan", "can", "man", ];
 var shuffledWords = listOfWords.slice(0, 12);
 shuffledWords.sort(function () {
     return 0.5 - Math.random();
 });

var tbl = document.createElement('table');
tbl.style.border='solid 1px silver';

for (var i = 0; i < shuffledWords.length; i++)
{
    var word = shuffledWords[i];
    var row = document.createElement('tr');

    for (var j = 0; j < word.length; j++)
    {
        var cell = document.createElement('td');
        cell.style.border='solid 1px silver';

        cell.innerText = word[j];
        // IF FIREFOX USE cell.textContent = word[j]; INSTEAD
        row.appendChild(cell);
    }

    tbl.appendChild(row);    
}

document.body.appendChild(tbl);

http://jsfiddle.net/YJjkB/1/

于 2012-07-13T11:11:52.070 に答える