Javascript JQuery:可见选择器未提供正确的输出

我试图找到第一个“可见的”

li

，在下面的代码中，这将是

li2-2

但是由于某种原因，

.children（'li:visible'）

或

.attr（）

给了我来自

的第一个

我该如何解决这个问题


alert（$（“#myul”）.children（'li:visible'）.attr（“id”）

身体（曾祖父母）
分区（祖父母）
ul（直接母公司）
li（儿童）
跨度（孙子）

li（儿童）
跨度（孙子）

li（儿童）
跨度（孙子）

li（儿童）
跨度（孙子）

正如在“可见性为：隐藏”或“不透明度为：0”的元素中所述，这些元素被视为可见

这会导致您的代码选择all

li

s

您可以使用

.filter（）

使筛选元素具有

可见性：可见


var id=$（“#myul”）.children（'li'）.filter（函数（）{
返回$（this.css（“可见性”）=“可见”
}).first（）.attr（“id”）；
console.log（id）

分区（祖父母）
ul（直接母公司）
li（儿童）
跨度（孙子）

li（儿童）
跨度（孙子）

li（儿童）
跨度（孙子）

li（儿童）
跨度（孙子）



正如在“可见性为：隐藏”或“不透明度为：0”的元素中所述，这些元素被视为可见

这会导致您的代码选择all
li
s

您可以使用
.filter（）
使筛选元素具有
可见性：可见


var id=$（“#myul”）.children（'li'）.filter（函数（）{
返回$（this.css（“可见性”）=“可见”
}).first（）.attr（“id”）；
console.log（id）

分区（祖父母）
ul（直接母公司）
li（儿童）
跨度（孙子）

li（儿童）
跨度（孙子）

li（儿童）
跨度（孙子）

li（儿童）
跨度（孙子）


您可以使用第n个子项选择器选择特定的子项


$（文档）.ready（函数（）{
警报（$（“#myul li:第n个孩子（2）：可见”）.attr（“id”）；
});

分区（祖父母）
ul（直接母公司）
li（儿童）
跨度（孙子）

li（儿童）
跨度（孙子）

li（儿童）
跨度（孙子）

li（儿童）
跨度（孙子）


您可以使用第n个子项选择器选择特定的子项


$（文档）.ready（函数（）{
警报（$（“#myul li:第n个孩子（2）：可见”）.attr（“id”）；
});

分区（祖父母）
ul（直接母公司）
li（儿童）
跨度（孙子）

li（儿童）
跨度（孙子）

li（儿童）
跨度（孙子）

li（儿童）
跨度（孙子）


您可以通过以下方式使用它：

alert($("#myul").children('li[style="visibility:visible;"]').attr("id"));

您可以通过以下方式使用它：

alert($("#myul").children('li[style="visibility:visible;"]').attr("id"));

它很简单，但是
li
s不应该有另一个样式poperty您可以将属性设置为
li
as data visible=true，然后选中
li[data visible=true]
它很简单，但是
li
s不应该有另一个样式poperty您可以将属性设置为
li
as data visible=true，然后选中
li[数据可见=真]