如何使用javascript/jquery动态生成这种嵌套的li对象

How do dynamically generate this kind of nested li objects using javascript/jquery?

本文关键字:嵌套 对象 li javascript 何使用 jquery 动态      更新时间:2024-04-15

我想在jsp中动态生成以下类型的嵌套li对象。我该怎么做。我无法使用简单的document.createElement("LI")解决问题;和appendElement,因为我也想向这些元素添加类。

<li class="level1">
                            <div class="thumb">
                                <a href="detail.html#"><img src="images/comments1.gif"
                                    alt="" /></a>
                            </div>
                            <div class="desc">
                                <div class="commentlinks">
                                    <a href="detail.html#" class="reply">Reply</a> <a
                                        href="detail.html#" class="like">Like</a> <a
                                        href="detail.html#" class="dislike">Dislike</a>
                                </div>
                                <h5>
                                    <a href="detail.html#" class="colr">By MySebbb:</a>
                                </h5>
                                <p class="time">7 months ago</p>
                                <div class="clear"></div>
                                <p class="txt">Lorem ipsum dolor sit amet, consectetuer
                                    adipiscing elit. Sed elit. Nulla sem risus, vestibulum in,
                                    volutpat eget, dapibus ac, lectus. Curabitur dolor sapien.</p>
                            </div>
                        </li>

在JQuery中,您可以执行:

$('<li class="level1"></li>').appendTo('ul');

li中,您可以添加所有的html。

首先,在JS代码中,将整个html作为字符串存储在var list = '<li>your code inside list</li>'这样的变量中。然后使用:

$('selector').append(list);

您可以在for循环中使用此语句多次添加列表。希望这就是你想要的。以下是

的演示示例