填写html表

Question

假设我有这样的html表：

<table>
    <tr>
        <td>16</td>
        <td>3</td>
        <td>2</td>
        <td>13</td>
    </tr>
    <tr>
        <td>5</td>
        <td>10</td>
        <td>11</td>
        <td>8</td>
    </tr>
    <tr>
        <td>9</td>
        <td>6</td>
        <td>7</td>
        <td>12</td>
    </tr>
    <tr>
        <td>4</td>
        <td>15</td>
        <td>14</td>
        <td>1</td>
    </tr>
</table>

并且有这样的字符串：I and my dog)...

我该怎么办，jquery库的javascript通过我的字符串迭代，并将此字符串符号附加到我的html表中，因此，第一个字母I转到td，其中td包含1个数字，空格转到第二，a用3等转到td，我是js的新手，但必须这样做，我该怎么做？

如何通过字符串进行迭代，并将字母附加到具有相同数字的td？

Answer 1

首先，迭代字符串的每个字符：

for (var i=0, len=str.length; i<len; i++) {
  var char = str.charAt(i);

然后，找到具有相应编号的td：

$("td:contains(" + (i+1) + ")", $table).text(char);

$table是您的表格，例如： <{1}}在循环之外。

完整代码：

→ Working jsFiddle

var $table = $("table")

这还没有完全奏效，因为：contains（1）也匹配16.我会调查。

Answer 2

我要去纯粹的javascript here。

var str = 'I and my dog)..', // test string
    // get list of td elements
    td = document.getElementsByTagName('td'),
    i = 0,
    l = td.length;

// iterate thru each <td> element
for (; i < l; i++) {
  // save the number in the current <td>
  var num = parseFloat(td[i].innerText);
  // fill the current <td> with the matching string index;
  td[i].innerHTML = num + (str[--num] || ''); 
 //  (str[--num] || '') this will catch undefined string index
}

Answer 3

试试这个：

var data  = "I and my dog)..."

$("td").each(function(index){
   $(this).text(data[index])
});