0

有没有更好的方法来编写以下内容,最好有无限的子级别......?

$('#menu-primary-navigation li > ul.sub-menu').addClass('lvl-1');
$('#menu-primary-navigation li li > ul.sub-menu').removeClass('lvl-1').addClass('lvl-2');
$('#menu-primary-navigation li li li > ul.sub-menu').removeClass('lvl-2').addClass('lvl-3');
$('#menu-primary-navigation li li li li > ul.sub-menu').removeClass('lvl-3').addClass('lvl-4');

请注意,整个菜单是动态创建的,因此我无法手动将类添加到每个级别。

这是起始代码的示例:

        <ul id="menu-primary-navigation" class="menu">

           <li><a href="#">Top Level</a></li>
           <li><a href="#">Top Level</a>
                <ul class="sub-menu">
                    <li><a href="#">Sub-level 1</a></li>
                    <li><a href="#">Sub-level 1</a></li>
                </ul>
            </li>
            <li><a href="#">Top Level</a>
                <ul class="sub-menu">
                    <li><a href="#">Sub-level 1</a>
                            <ul class="sub-menu">
                                <li><a href="#">Sub-level 2</a>
                                    <ul class="sub-menu">
                                    <li><a href="#">Sub-level 3</a>
                                            <ul class="sub-menu">
                                                <li><a href="#">Sub-level 4</a></li>
                                                <li><a href="#">Sub-level 4</a></li>
                                            </ul>
                                    </li>
                                    <li><a href="#">Sub-level 3</a></li>
                                </ul>
                                </li>
                                <li><a href="#">Sub-level 2</a></li>
                            </ul>
                    </li>
                    <li><a href="#">Sub-level 1</a></li>
                </ul>
            </li>

        </ul>
​
4

0 回答 0