Javascript jQuery：获取嵌套列表中top UL中类型的第一个元素

我有一个嵌套列表，如下所示：

<ul class="list">

    <li class="list_item_type_1">
        <ul class="list">
            <li class="list_item_type_2">Unnested item</li>
        </ul>
    </li>

    <li class="list_item_type_2">Unnested item</li>

</ul>

$('.list:first').find('li.list_item_type_2:first').before('<li class="list_item_type_1">Nested list (...)</li>');

这将无法正常工作，因为脚本会在第二个中找到第一个

.list\u item\u type\u 2

。list并将新代码追加到那里

如何将搜索保持在第一个

ul

中，并防止其进入底层

ul

元素

---

干杯

是否可以尝试将选择器组合到一个表达式中

$('.list:first > LI.list_item_type_2:first').before('<li class="list_item_type_1">Nested list (...)</li>');

$（'.list:first>LI.list\u item\u type\u 2:first'）。之前（'
嵌套列表（…）
）；

---

选择器仅与直接子级匹配。

是否可以尝试将选择器组合到一个表达式中

$('.list:first > LI.list_item_type_2:first').before('<li class="list_item_type_1">Nested list (...)</li>');

$（'.list:first>LI.list\u item\u type\u 2:first'）。之前（'
嵌套列表（…）
）；

---

选择器只匹配直接子级。

首先，我建议这样构造HTML。使用jQuery组装HTML。它负责逃跑和所有其他有用的东西：

$("<li></li>").addClass("list_item_type_1")
  .text("Nested list (...)")
  .prependTo("ul.list:first > li.list_item_type:first");

$（“
”）.addClass（“列表项类型1”）
.text（“嵌套列表（…）”）
.prependTo（“ul列表：第一个>li列表项目类型：第一个”）；

---

此外，在可能的情况下，始终在裸类选择器（“.list”）上使用标记选择器（“ul.list”）。在大多数浏览器上，它的速度要快得多。

首先，我建议用这种方式构建HTML。使用jQuery组装HTML。它负责逃跑和所有其他有用的东西：

$("<li></li>").addClass("list_item_type_1")
  .text("Nested list (...)")
  .prependTo("ul.list:first > li.list_item_type:first");

$（“
”）.addClass（“列表项类型1”）
.text（“嵌套列表（…）”）
.prependTo（“ul列表：第一个>li列表项目类型：第一个”）；

此外，在可能的情况下，始终在裸类选择器（“.list”）上使用标记选择器（“ul.list”）。在大多数浏览器上，它的速度要快得多。

你离得太近了

不要使用搜索所有子代的

find（）

，而使用只搜索子代的

children（）

测试：

你太接近了

不要使用搜索所有子代的

find（）

，而使用只搜索子代的

children（）

---

测试：

太慢了……我也喜欢这样，正如您所说，这是使用jQuery构建HTML的更好方法+1太慢了……我也喜欢这样，正如您所说，这是一种使用jQuery构建HTML的更好方法+1.