如何获取填充的li元素之间的空li元素的长度？

Question

I have multiple <li> elements and they will be populated randomly after loading. For example if I have twelve <li> elements and only two of them are populated, how can I get the number of empty <li> elements and the populated ones?

This is a test markup, my problem is how can I get the length between populated <li> :

<ul>
    <li></li>
    <li><span>text</span></li>
    <li></li>
    <li></li>
    <li></li>
    <li><span>text</span></li>
</ul>

Answer 1

Im not sure, that I understand what you want but here is an example what I think you want.

    <script>

    function getItems() {
       var count = [0,0];

       $("li").each(function() {
       if($(this).text().length != 0)
          count[0]++;
       else
          count[1]++;
       });
       return count;
    }

    var items = getItems();
    // items[0] should return 4
    // items[1] should return 2

    </script>

I hope this can help you.

Answer 2

Hope can help you.

function getItems() {
    let indexNotEmpty = [];
    $('ul > li').each(function(i, item) {

        if(item.innerText != ''){
            indexNotEmpty.push(i);
        };
    });

  return indexNotEmpty[indexNotEmpty.length-1]-indexNotEmpty[0]-1;
}