javascript - 如何使用append()在内容 block 之前和之后放置<div>和</div>？

Question

所以我想做的是通过先追加、然后内容、最后追加来添加外部 div 容器。但结果似乎是我在开始时添加的通过自动插入一个 .结果是两个独立的 div。

有人吗？谢谢!

//adds the outer div tag here...
$('#aspcal tr:eq(' + loopweek + ') td:eq(' + loopday + ')')
     .append("<div id='outer' style='height:15px'>");

//adds the inner content here...
 for (l = 0; l < rssArray.length; l++) {

if (eleArray[l][19] == curNumMonth 
     && eleArray[l][20] == curNumDay 
     && eleArray[l][21] == curNumYear) {

    $('#aspcal tr:eq(' + loopweek + ') td:eq(' + loopday + ')')
       .append("</br><div style='height:auto'><b>" 
               + eleArray[l][8] 
               + "</b></br><a href='" 
               + eleArray[l][0] 
               + "' target='_blank'>" 
               + eleArray[l][1] 
               + "</a></div>");
}

//adds the outer div closing tag here...
$('#aspcal tr:eq(' + loopweek + ') td:eq(' + loopday + ')').append("</div>");​

Answer 1

您不是使用 jQuery 创建标签，而是创建 DOM 对象。一个div由开始和结束标记以及属性等表示，但由浏览器解析并存储为数据树中的对象。 jQuery，最终是 javascript，只是告诉浏览器在树中创建一个新对象。

您应该创建外部 div，然后将内容附加到其中。 jQuery 将为您完成艰苦的工作。

//adds the outer div tag here...
$('#aspcal tr:eq(' + loopweek + ') td:eq(' + loopday + ')').append("<div id='outer' style='height:15px'>");


//adds the inner content here...
for (l = 0; l < rssArray.length; l++) {
    if (eleArray[l][19] == curNumMonth && eleArray[l][20] == curNumDay && eleArray[l][21] == curNumYear) {
        $('#outer').append("</br><div style='height:auto'><b>" + eleArray[l][8] + "</b></br><a href='" + eleArray[l][0] + "' target='_blank'>" + eleArray[l][1] + "</a></div>");
}

我只引用#outer在选择器中，因为作为ID，它应该是唯一的。如果不是，请将其更改为一个类并执行以下操作:

//adds the outer div tag here...
var aspcal = $('#aspcal tr:eq(' + loopweek + ') td:eq(' + loopday + ')');
aspcal.append("<div class='outer' style='height:15px'>");


//adds the inner content here...
for (l = 0; l < rssArray.length; l++) {
    if (eleArray[l][19] == curNumMonth && eleArray[l][20] == curNumDay && eleArray[l][21] == curNumYear) {
        aspcal.find('.outer').append("</br><div style='height:auto'><b>" + eleArray[l][8] + "</b></br><a href='" + eleArray[l][0] + "' target='_blank'>" + eleArray[l][1] + "</a></div>");
}

如果您已经创建了内容，则可以使用 .wrap('<div>')在您的内容周围添加一个 div(或任何其他可作为父对象的对象)。