Question

如果UL具有奇数个LI记录，我想在第一个LI之后添加BREAK标记（<br />）。

如果LI的数量为偶数，则结果为：

  <ul id="cat">
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
  </ul>

如果LI的数量是ODD，那么这是结果：

  <ul id="cat">
    <li><a href=""></a></li><br />
    <li><a href=""></a></li>
    <li><a href=""></a></li>
  </ul>

我的jQuery代码段：

$("#cat").each(function() {
    var elem = $(this);
    if (elem.children("li").length % 2 != 0) {
        elem.prepend("<br />");
    }
});

它只会导致

      <ul id="cat">
<br />
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
      </ul>

Answer 1

你做错了是你在UL之前。这将在所有LI之前添加一个。如果您获得了第一个LI并且after()，则在LI之后添加BR。这也是无效的HTML。所以请为此使用CSS。

如果您仍想以这种方式使用Javascript：

$("#cat").each(function() {
    var elem = $(this);
    if (elem.children("li").length % 2 != 0) {
        elem.children("li").first().after("<br />");
    }
});

但是为什么一个BR之后的LI？你不能用CSS解决这个问题吗？

li {
    display: block;
}

Answer 2

$("#cat").each(function() {
    var elem = $(this);
    if (elem.children("li").length % 2 != 0) {
        elem.find(">:first-child").prepend("<br />");
    }
});

Answer 3

你可以这样做：

$("#cat").each(function() {
    var elem = $(this);
    if (elem.children("li").length % 2 != 0) {
        elem.find("li:first").append("<br />");
    }
});

Answer 4

使用children（“li：first”）和.after（）在第一个LI之后插入
。

$("#cat").each(function() {
    var elem = $(this);
    if (elem.children("li").length % 2 != 0) {
        elem.children("li:first").after("<br />");
    }
});

Answer 5

您不应在列表中插入除<li>标记之外的任何内容 - 它不是有效的HTML。

我会选择：

elem.children().first().css('display', 'block');

然而，准确的CSS取决于你正在努力实现目标。

Answer 6

使用css代替输出

如果你将它设置为第一个il，你将获得相同的效果

clear:both;
display:block;

Jquery计数LI和IF奇数做点什么

6 个答案: