Question

我的问题与jQuery和DOM元素有关。我需要一个如下模板：

var threadreply = " <li class='replyItem'>"
                + "     <div class='clearfix'>"
                + "         ${tittle}"
                + "     </div>"
                + " </li>"
                ;
$.template( "threadreply", threadreply );

如您所见，这是一个列表元素。我的问题是当我用$.tmpl解析它时，它会检索没有<li> </li>标记的有效DOM元素。

liElement = liElement + $.tmpl("threadreply", {"tittle": "hello"} ).html();

有没有办法可以在不重新格式化的情况下检索元素？

我知道我可以使用带有有效ul标记的模板并在每个jQuery模板循环中进行，但我不使用JSON，我无法将我的数据结构转换为JSON。 / p>

完整示例如下：

var threadreply = " <li class='replyItem'>"
                + "     <div class='clearfix'>"
                + "         ${tittle}"
                + "     </div>"
                + " </li>"
                ;
$.template( "threadreply", threadreply );

var liElement = "";
for( var i = 0; i < 150; i ++ ){
    liElement = liElement + $.tmpl("threadreply", {"tittle": "hello"} ).html();
}
$(liElement).appendTo("#ULElement");

EDITED

我找到了一个使用此线程的解决方法：JQuery Object to String包含在$.tmpl中绑定div返回的每个DOM元素，然后获取对象的.html()：

liElement = liElement + $('<div>').append( $.tmpl("threadreply", {"tittle": "hello"} )).html();

使用300个元素，处理所有元素需要大约290毫秒。使用循环内的appendTo()，需要超过800毫秒。

Answer 1

你没有得到'li'元素，因为当你做

时

liElement = liElement + $.tmpl("threadreply", {"tittle": "hello"} ).html();

你得到'li'元素的包含 html（或innerhtml）。

HTML：

<ul id="titleList">
</ul>

JS：

$.tmpl("threadreply", {"tittle": "hello"}).appendTo('#titleList');

Answer 2

您只需要字符串而不是真正的DOM元素。只需使用：

liElement = liElement + $.tmpl("threadreply", {"tittle": "hello"});

在循环之外，您需要将刚刚生成的HTML包装到一个新元素中，然后替换以前的li：

$('<li />').html(liElement).replaceAll('li#existingLiID');

jQuery具有不完整的DOM元素

2 个答案: