Jquery:找到混合列表的长度

时间:2015-11-24 05:35:14

标签: javascript jquery html

这是示例列表:

<ul>
    <li>Item:
        <ol>
            <li>Point:
                <div>
                    <ul>
                        <li>elem1</li>
                    </ul>
                </div>
            </li>
        </ol>
    </li>
    <li>elem2</li>
</ul>
<ul>
    <li>Point:
        <div>
            <ul>
                <li>elem1</li>
            </ul>
        </div>
    </li>
</ul>
<ul>
    <li>simple list1</li>
</ul>

我有一个代码可以从无序列表中找到深度:

var n = 0

$('ul').each(function(i){ 
    if (($(this).parents('ul').length + 1) > n) { n = $(this).parents('ul').length + 1; }
});

但如果有多个列表和混合列表怎么办?

编辑:此处混合列表表示ul列表和ol列表。

1 个答案:

答案 0 :(得分:1)

关键是将ol添加到支票的选择器。

var n = 0

$('ul, ol').each(function(i){ 
    if (($(this).parents('ul, ol').length + 1) > n) { n = $(this).parents('ul, ol').length + 1; }
});

$('#result').html(n);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
    <li>Item:
        <ol>
            <li>Point:
                <div>
                    <ul>
                        <li>
                          elem1
                          <ol>
                            <li>elem1_1</li>  
                          </ol>
                      </li>
                    </ul>
                </div>
            </li>
        </ol>
    </li>
    <li>elem2</li>
</ul>
<ul>
    <li>Point:
        <div>
            <ul>
                <li>elem1</li>
            </ul>
        </div>
    </li>
</ul>
<ul>
    <li>simple list1</li>
</ul>

<hr />

<div id="result"></div>