在jquery / javascript中我的动态追加td有什么问题？

Question

I have a table where each row contains two elements:

<table>
<tr><td>A</td><td>B</td></tr>
<tr><td>C</td></tr>
</table>

I am trying to append a cell with "D" into the last row (the 2nd row that is already there in the current table), but am having difficulty.

I tried to perform:

$("table").children().get(1).append("<td>D</td>");

and

var elem = $("<td/>", {
    text: 'D'
});

$("table").children().get(1).appendChild(elem);

and I get the error:

Uncaught Error: NotFoundError: DOM Exception 8 

Putting tbody in there does not work either:

$("table tbody").children().get(1).appendChild(elem);

What is to proper way to do this?

I do not want to depend on just the "last td" as assuming I had another element "E", I would want it to automatically add to a third row by itself as opposed to tacking it on as a third column at the end of the 2nd row.

Answer 1

Try:

$("table td:last").after("<td>D</td>");

jsFiddle example

Results in the structure:

<table>
<tbody><tr><td>A</td><td>B</td></tr>
<tr><td>C</td><td>D</td></tr>
</tbody></table>

Answer 2

尝试这个：

$('<td>D</td>').appendTo('table tr:eq(1)');

Answer 3

you can append dynamically by finding next letter from existed letter.May be You need to modify as per your requirement.

HTML

<table>
    <tr>
        <td>A</td>
        <td>B</td>
    </tr>
    <tr>
        <td>C</td>
    </tr>
</table><button type="button" id="addanother" >Add</button>

JS :

$('#addanother').on('click',function(){
    var length=$('table').find('td:last').parent().children().length;
    var text=$('table').find('td:last').text();
     var nextlet=nextLetter(text);
    if(length == 2){
         $('table').find('tr:last').after('<tr><td>'+nextlet+'</td></tr>');
    }else if(length == 1){
           $('table').find('td:last').after('<td>'+nextlet+'</td>');
    }
  });

// To get alphabets from A-Z from a-z
  function nextLetter(s){
return s.replace(/([a-zA-Z])[^a-zA-Z]*$/, function(a){
    var c= a.charCodeAt(0);
    switch(c){
        case 90: return 'A';
        case 122: return 'a';
        default: return String.fromCharCode(++c);
    }
});

}

Fiddler : http://jsfiddle.net/j98H7/1/