Jquery và thêm hàng vào bảng

Question

Tôi có mã jquery sau.

var destTable = $("#numbers"); 
$(document).ready(function() { 
    $("#btnAdd").click(function() { 
    //Take the text, and also the ddl value and insert as table row. 
    var newRow = $("<tr><td>hi</td></tr>"); 
    $("#numbers").append(newRow); 
    }); 
}); 

Điều tôi thực sự muốn là lưu trữ tham chiếu đến phần tử một lần và sau đó sử dụng nó từ đó.

Mã ở trên thêm hàng vào bảng của tôi như mong đợi nhưng nếu tôi sử dụng. $(destTable).append(newRow) hoặc destTable.append(newRow) không có gì xảy ra bất cứ ai có thể làm sáng tỏ điều này cho tôi?

Cảm ơn

Answer 1

Giữ tham chiếu bên trong document.ready:

$(document).ready(function() { 
    var destTable = $("#numbers"); 
    $("#btnAdd").click(function() { 
    //Take the text, and also the ddl value and insert as table row. 
    var newRow = $("<tr><td>hi</td></tr>"); 
    $("#numbers").append(newRow); 
    }); 
}); 

Mấu chốt của document.ready là để chờ đợi cho DOM để sẵn sàng; nếu bạn cố gắng làm $('#numbers'); bên ngoài nó (và mã không xuất hiện sau phần tử trong tài liệu) DOM sẽ chưa tạo phần tử này để bạn không có tham chiếu thích hợp với nó.

Khi bạn làm điều này, bạn sẽ có thể làm:

destTable.append(newRow); 

Bên trong click chức năng. Tuy nhiên, lưu ý cuối cùng là một thực tiễn phổ biến và được chấp nhận để bắt đầu các biến đại diện cho các bộ jQuery với một số $. Vì vậy, đây là tốt nhất:

var $destTable = $("#numbers"); 

Answer 2

bạn có thể sử dụng appendTo như thế này:

$("<tr><td>Hello</tr><tr>").appendTo("#MyTable > tbody")