如何獲取對動態添加元素的引用？

下面的代碼意一個已經存在的元件之前插入一個元件插入DOM然後插入一個表新插入元件下面（使得表出現在兩個元件之間）：如何獲取對動態添加元素的引用？

$("#para1").before("<p id = 'para2'>" + printDate + "</p>"); 
$("#para2").after("<table id = 'table'></table>");

然而，當我嘗試將行添加到新插入的表格，就像這樣：

$("#table").prepend("<tr><td>asdfasf</td></tr>");

行總是被添加到不同的表（用不同勢ID）ID爲元素之前，坐在para2。什麼可能是這種奇怪的行爲的原因？

這是DOM檢查器的快照。具有編號爲21-09-2014的桌子如何在兩個不同的地方？

enter image description here

編輯：你是正確的。我之前添加了一張空白表格，並且認爲它不在那裏，因爲我看不到它。那小子花了我5個小時的計費工作！

來源

2014-09-22 raul

不，這表有不同的ID – raul 2014-09-22 13:07:39

重複的ID應該會發生這種情況的唯一原因。你可以在JSFiddle或其他東西中重現問題嗎？ – 2014-09-22 13:08:23

如果沒有HTML（JSFiddle或「代碼片段」），這主要是猜測，因爲您的代碼當然應該可以工作（如果頁面上沒有重複的ID）。 – 2014-09-22 13:11:37

將條目添加到其他表的主要問題可能是在頁面中重複ids。如果這裏是重複的id，id選擇器將返回帶有id的第一個元素。

爲了獲得對新添加的元素使用.insertBefore()和insertAfter()的引用，而不是分別使用before()和after()。

var $para = $("<p id = 'para2'>" + printDate + "</p>").insertBefore('#para1'); 

var $table = $("<table id = 'table'></table>").insertAfter('#para2'); 
$table.append("<tr><td>asdfasf</td></tr>");

來源

2014-09-22 13:07:30

OP說他們有不同的ID。 – Scimonster 2014-09-22 13:08:18

您正在嘗試添加到表格中嗎？你不應該使用

$('#table tr:last').after('<tr><td>asdfasf</td></tr>');

改爲？

or：first and before？

來源

2014-09-22 13:27:20 artm

我希望它顯示爲表中的第一行。這會做到嗎？ – raul 2014-09-22 13:28:46

嘗試tr：先和 – artm 2014-09-22 13:29:12

這應該是答案。使用append不會將正確的行添加到表中。 – 2014-09-22 13:30:17

$("#para1").before("<p id = 'para2'>The new p element with Id='para2' </p>"); 
 
$("#para2").after("<table id = 'table'><tr><td>The second row</td></tr></table>"); 
 

 
$("#table").prepend("<tr><td>new row inner #table and it will be the first row</td></tr>")

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<table id="table-with-diferent-id">table with diferent id that already exist</table> 
 
<p id="para1">para 1</p>

來源

2014-09-22 13:31:27

如何獲取對動態添加元素的引用？

回答

相關問題