jQuery的.append（）根据需要

不工作这是我的代码，我正在撰写一个表：jQuery的.append（）根据需要

$("#results").append("<table><tr><th>Name</th><th>Phone Number</th></tr>"); 
$("#results").append("<tr><td>John</td><td>1231231234</td></tr>"); 
$("#results").append("</table>");

当我使用CSS应用边框这个表，它不得到正确应用。
请参考这个小提琴：http://jsfiddle.net/23NQX/1/

我在做什么错在这里？

来源

2014-01-15 Rahul Desai

看看另这三行。没有上下文，他们没有意义。但他们是独立执行的。 – Prinzhorn

Append需要*元素*（将自动从HTML字符串创建） - 它不会*部分HTML片段，因为它直接在DOM上工作。 – user2864740

创建变量table ..追加<tr>吧...和追加最终table导致

试试这个

var table=$('<table>'); 
table.append('<tr><th>Name</th><th>Phone Number</th></tr>'); 
table.append("<tr><td>John</td><td>1231231234</td></tr>"); 

$("#results").append(table);

更加清晰可读。

追加不接受额外的参数，所以你甚至可以做

table.append('<tr><th>Name</th><th>Phone Number</th></tr>',"<tr><td>John</td><td>1231231234</td></tr>");

但我更喜欢去与第一...

fiddle

来源

2014-01-15 08:09:58 bipen

这是做到这一点的正确方法。 – user1853181

追加未关闭的标签将自动关闭标签，如果你不亲自关闭它们，所以在你的情况下，它会创建2个表。所以把字符串放在一起。

$("#results").append("<table><tr><th>Name</th><th>Phone Number</th></tr><tr><td>John</td><td>1231231234</td></tr></table>");

DEMO

来源

2014-01-15 08:08:14 Anton

-1

$("#results").append("<table id='my_table' border='1'><tr><th>Name</th><th>Phone Number</th></tr></table>"); 
$("#my_table").append("<tr><td>John</td><td>1231231234</td></tr>");

来源

2014-01-15 08:09:36

它没有工作。 http://jsfiddle.net/23NQX/3/ –

你必须首先创建表，然后将行附加到表。

像这样：

$("#results").append("<table><tr><th>Name</th><th>Phone Number</th></tr></table>"); 
$("#results > table").append("<tr><td>John</td><td>1231231234</td></tr>");

退房this fiddle

来源

2014-01-15 08:10:36

你的第一个附加创建表，然后附加表

$("#results").append("<table><tr><th>Name</th><th>Phone Number</th></tr></table>"); 
$("#results").children("table").append("<tr><td>John</td><td>1231231234</td></tr>");

来源

2014-01-15 08:11:19 timo

我总是觉得它有助于想到的事情反过来：

// create the table 
$("<table>") 
    // append the header 
    .append("<tr><th>Name</th><th>Phone Number</th></tr>") 
    // append a row to the table 
    .append("<tr><td>John</td><td>1231231234</td></tr>") 
    // append the table to the DOM 
    .appendTo($("#results"));

Here's a fiddle显示这个工程，因为你想要的，并且更容易阅读。

来源

2014-01-15 08:12:06 Jivings

我给你使用一个结构：

$("#results").append($("<table>") 
       .append($("<tr>") 
        .append($("<th>").html("Name")) 
        .append($("<th>").html("Phone Number")) 
       ) 
       .append($("<tr>") 
        .append($("<td>").html("John")) 
        .append($("<td>").html("123123123")) 
       ) 

)

可以很容易地修改和读取。

DEMO：http://jsfiddle.net/23NQX/7/

来源

2014-01-15 08:14:08

一个简单的方法

$("#results").append("<table id='table'><tr><th>Name</th><th>Phone Number</th</tr></table>"); 
$("#table tr:last").after("<tr><td>John</td><td>1231231234</td></tr>");

来源

2014-01-15 08:15:05 user2211216

jQuery的.append（）根据需要

回答

相关问题