添加<tbody>的jQuery冗余<br>

问题描述：

<div class="productlist" style="float:left;" id="productlist"> 
<script type="text/javascript" language="javascript"> 
    function loadMore() { 
     var $parent = $("#productlist").empty(); 
     $parent.append('<table id="myTable" cellpadding="0" cellspacing="0" width="100%" class="productlist" style="margin-left:4px; padding-top:2px;"><tbody>'); 
     var $table = $parent.find("#myTable > tbody"); 
     var htmlRow = [ 
        '<tr align="center">', 
        '<td align="center" id="colunm-product">', 
        '<br />', 
        '<div id="brand-item"><a href="#" class="brand_id"><img src="' + value.BrandImage + '" width = "85px"/></a></div>', 
        '<div id="product_image"><a href="'+'<%: Url.Content("~/") %>' +'Products/ProductSpec/' + value.ID +'?dep='+ value.DepartmentID +'&cat='+value.CategoryID+'&tab=2" style="text-decoration:none"><img src="' + value.PictureName + '" alt="Product" width="135px"/></a></div>', 
        '</td>', 
        '</tr>' 
         ]; 
     $table.append(htmlRow.join('')); 
     $("#myTable > tbody").append('</tbody></table>'); 
    } 
    </script>

我调用的document.ready功能。但结果在我看来是意外：

<table id="myTable" cellpadding="0" cellspacing="0" width="100%" class="productlist" style="margin-left:4px; padding-top:2px;"> 
    <tbody> 
     <br/><br/> 
     <tr> my data </tr> 
    </tbody></table>

我不知道为什么会出现在表中<br><br>。如何避免这个问题？

谢谢。

你打算叫'.append我不认为（）'不平衡HTML片段。我不确定它是否与您的问题有关，但我会一次添加完整的空表，然后添加行。 – recursive

答

您试图插入DOM，如果你是在文本编辑器编写HTML，这是错误的做法。你插入的任何元素都是一个完整的元素，它已经“关闭”了。你不能插入表格的开始html，添加一些行，然后添加结束标签...就像你会写它。

当您插入一个空表为例使用jQuery，有几种方法来写标签：

$('<table>') 
$('<table/>') 
$('<table></table>') // skipping over tbody issues for now

所有3产生同样的事情...一个完整的表DOM节点。该表已经已经关闭，因为我们认为它与HTML标签，并在IE的某些，可能还有其他浏览器的情况下，它有一个TBODY为好。把它看作是html的顶部和底部。

现在，当我们追加内部元素时，他们也需要完整。

表的例子就是一个标签，一次插入多张标签需要有效的封闭的HTML作为我们在编辑器中knwow它。

$（“”）不工作，在这种情况下，两个标签必须按照正确的顺序关闭。同样，我们不追加行数，然后尝试抛出tbody和table的结束标记，就像您尝试过的那样。

我相信这应该给你，以便它不分散如何调整你的代码更好的理解。

插入支离破碎的代码你已经尝试会产生不必要的beahvior甚至可能拒绝

现在我添加了'$ parent.append（'

“）; '，这是正确的吗？但我认为，每一件事都没有改变。 – Nothing

是页面中现有的html有效吗？尝试删除'
'不需要在块元素之前。也不需要清空$ parent，可以使用$ parent.html（） – charlietfl

添加的jQuery冗余

相关推荐