0

我有一些 ul 上课

<ul class="class">

</ul>

我有 jquery 脚本，它必须在 ul-tags 之间放置 li-tags：

$(document).ready(function() {
  $("select option").each(function () {
        var m = $( this ).text();
        $("ul.class").append("<li>", m, "</li>");
  });

但它不起作用。脚本完成后，我看到 html 如下：

<ul class="class">
   <li></li>
   Option 1
   <li></li>
   Option 2
   <li></li>
   Option 3
</ul>
4

3 回答 3

3

利用$("ul.class").append("<li>"+m+"</li>");

代替

$("ul.class").append("<li>" + m + "</li>");.

根据文档，它“将由参数指定的内容插入到匹配元素集中每个元素的末尾”。语法是.append( content [, content ] )或者您可以使用.append( function(index, html) ). 追加可以采用任意数量的附加参数。

现在发生的事情是 $("ul.class").append("<li>" + m + "</li>");，每个参数都将作为单独的 DOM 内容附加。这就是为什么你的“ <li></li>”首先被附加，然后是“文本”。“文本”将被视为附加参数。

于 2013-03-26T04:59:11.847 回答
2

我还建议在将 LI 元素的整个列表传递给 append(..) 之前将其构建为单个字符串。限制会导致浏览器将 DOM 结构更改为单个调用的调用更有效。

在循环中构建字符串并将其传递给循环后的追加

前任：$('ul').append('<li>option1'</li>.....<li>optionn<li>');

于 2013-03-26T04:56:49.383 回答
2 
$("ul.class").append("<li>", m, "</li>");

应该

$("ul.class").append("<li>" + m + "</li>");
于 2013-03-26T04:52:38.557 回答