使用jQuery .append构建表，产生不正确的html

我编写了以下javascript来动态构建日历并将其附加到指定的div。 它工作正常，日历在浏览器中看起来很好。

$('#Calendar').append(''); for (i = 0; i <= loop; i++) { if ((i == 7) || (i == 14) || (i == 21) || (i == 28) || (i == 35)) { $('#Calendar').append(loopDate.getDate() + ""); $('#Calendar').append(''); loopDate.addDays(1); } else { $('#Calendar').append(''); loopDate.addDays(1); } } $('#Calendar').append('
Monday
Tuesday
Wednesday
Thursday
Friday
Saturday
Sunday
' + loopDate.getDate() + '
' + loopDate.getDate() + '
'); } 

但是，当我检查页面的结果HTML时，我看到我的

没有登陆到正确的位置。 似乎还有一个无关紧要的附加内容。 有人可以向我解释为什么会这样吗？

 
 
 
 
 
 
Monday
 
Tuesday
 
Wednesday
 
Thursday
 
Friday
 
Saturday
 
Sunday
 
 
 
 
 
 26 27 28 29 30 31 1  2 3 4 5 6 7 8  9 10 11 12 13 14 15  16 17 18 19 20 21 22  23 24 25 26 27 28 29  

Answer 1

诸如append()类的jQuery方法操纵浏览器的DOM树。
DOM包含完整的 HTML元素。 你不能把一半的标签。

相反，您可以将HTML连接成一个字符串（或者，为了更好的性能，一个数组），然后立即将完整的HTML字符串放入DOM中。