用jquery为附加的子元素添加类名

Add class name to appended child elements with jquery

本文关键字：元素 添加 jquery      更新时间：2023-09-26

我有一个这样的表。

<table id='table1'>
</table>

，在这个表中，我使用jquery动态地向表中添加行，如下所示。

var tbl = $("#table1");
tbl.append('<tr></tr><tr></tr><tr></tr>');

我可以使用下面的2种方法添加类到附加的行
案例1 

tbl.find('tr').eq(0).addClass("test");
tbl.find('tr').eq(1).addClass("test");

或case 2

for (var i=0;i<tbl.find('tr').length;i++) {
    tbl.find('tr').eq(i).addClass("test")
}

和我的问题是有任何方式我可以添加相同的类名到动态追加的行。jquery中期待的答案。

一旦一个元素被添加到DOM中，您就没有办法知道它是否是动态添加的，除非您有自定义的代码来这样做。我建议将.append更改为.appendTo，以便您可以访问正在添加的行，并可以调用.addClass:

var tbl = $("#table1");
$('<tr></tr><tr></tr><tr></tr>').appendTo(tbl).addClass("test")

您也可以将类放在字符串中，然后附加它，或者在附加它之前修改它(添加一个类)。请注意，我的字符串中只有一个tr，但附加了多次(可选地添加一个类)

var tbl = $("#table1");
var tr = '<tr class="test"></tr>';
var td = '<td class="test">new data</td>';
//var addedrow = $(tr).append(td).addClass("newclass");//adds class to the row
var addedrow = $(tr).append(td);//create new row object
addedrow.find('td').addClass("newclass"); //adds class to the td in the new row
var ar2 = $(tr).append(td);
var ar3 = $(tr).append(td);
tbl.append(addedrow, [ar2, ar3]); // appends the new rows
tbl.find('tr').last(td).addClass("newclass");//add class to last rows td

在这里看到它的作用:http://jsfiddle.net/MarkSchultheiss/0osLfef3/

相关文章：