[英]Fill html table
假设我有这样的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
转到td 3等,我是js的新手,但必须这样做,我该怎么做?
如何通过字符串迭代,并将字母附加到相同数字的td?
首先,迭代字符串的每个字符:
for (var i=0, len=str.length; i<len; i++) {
var char = str.charAt(i);
然后,找到带有相应编号的td
:
$("td:contains(" + (i+1) + ")", $table).text(char);
其中$table
是你的表,例如var $table = $("table")
在循环之外。
完整代码:
var $table = $("table");
var str = "I and my dog";
for (var i=0, len=str.length; i<len; i++) {
var char = str.charAt(i);
$("td", $table).filter(function() {
return $(this).text() == (i+1);
}).text(char);
}
这还没有完全奏效,因为:contains(1)也匹配16.我会调查。
我将在这里使用纯JavaScript。
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
}
尝试这个:
var data = "I and my dog)..."
$("td").each(function(index){
$(this).text(data[index])
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.