Question

我是html和css的新手。所以我真的需要帮助，这是我的问题。

如何删除包含3 li而没有class或id的ol标记。

以下是示例：

<div class="text">
    <ol>
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ol>

    <ol>
        <li>1</li>
        <li>2</li>
    </ol>
</div>

这是预期的结果：

<div class="text">
    <ol>
        <li>1</li>
        <li>2</li>
    </ol>
</div>

提前致谢！

Answer 1

您可以使用filter() jQuery方法。

$('.text ol').filter(function() {

return $(this).children('li').length===3

}).remove();

$('.text ol').filter(function() {

return $(this).children().length===3

}).remove();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="text">
    <ol>
        <li>111</li>
        <li>2222</li>
        <li>3333</li>
    </ol>

    <ol>
        <li>1</li>
        <li>2</li>
    </ol>
   <ol>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
    </ol>   
    
</div>

Answer 2

如果您知道要删除的ol标记将首先位于div中，则可以使用第一个子选择器来定位它。

.text ol:first-child {
    display: none;
}

如果它的位置会发生变化，或者您要移除多个ol标记，则无法使用，而且您需要使用JavaScript。

＆＃13;

.text ol:first-child {
  display: none;
  }

＆＃13;

<div class="text">
    <ol>
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ol>

    <ol>
        <li>1</li>
        <li>2</li>
    </ol>
</div>

＆＃13;

Answer 3

我在JSBin中创建了一个解决方案，其中所有包含3个li标签的ol标签将从DOM中删除。这是链接solution

完成工作的代码：

$.each($('.text').find('ol'), function(i, item){
  if($(item).find('li').length == 3)
    {
      item.remove();
    }
});

如何删除包含特定号码li的ol？

3 个答案: