Question

当有多个ul / li列表时，我已经搜索过并且似乎无法找到只有一个孩子的方法。我只需要选择“莎莉”的第一个孩子，但使用“第一个”或“第一个”孩子会从所有列表中给我这个孩子。我尝试过使用eq（），但也没用。这是我在它下面的jQuery的第n个代码。

<div id="content2">
    <div>
        <div>
            <p>Some Text</p>
            <p>Some More Text</p>
            <div>Random Div</div>
            <ul>
                <li>Bob</li>
                <li>Sally
                    <ul>
                        <li>Car</li>
                        <li>Boat</li>
                        <li>Bike
                            <ul>
                                <li>Red</li>
                                <li>Green</li>
                                <li>Blue</li>
                            </ul>
                        </li>
                    </ul>
                </li>
                <li>Larry</li>
                <li>Mo</li>
            </ul>
        </div>
    </div>
</div>

$("#content2 ul li:nth-child(1)").append("<span> - 1st of Sally </span>");

Answer 1

$("#content2 ul:eq(1) li:eq(0)")会与第二个li中的第一个ul匹配，后者在您的html中与Sally的第一个孩子匹配，＆＃34; Car＆＃34;。

相当脆弱，基于元素顺序的任何匹配都是如此。如果可能，我建议为您计划修改的元素添加显式类名。

Answer 2

$("#content2 div > ul > li > ul > li:nth-child(1)").append("<span> - 1st of Sally </span>");

这不是很漂亮但会完成这项工作。如果您未在开头列出div，则也会选择红色，因为ul > li > ul > li也适用于红色。

jQuery在多级列表中只选择一个子节点

2 个答案: