jQuery 子选择器未按预期工作

标签 jquery jquery-selectors nested

这是我的标记:

<div class=widget>
    <div class=panel>panel1</div>
    <div class=panel>panel2
        <div class=widget>
            <div class=panel>panel1</div>
            <div class=panel>panel2</div>
        </div>
    </div>
</div>

我试图只选择类名为panel的直接(第一级?)子元素,不幸的是我总是得到嵌套元素(4而不是2)。

请看看我的 fiddle :

http://jsfiddle.net/rx8Jf/

怎么了?谢谢

最佳答案

您有两个具有相同类的父 div。将您的 HTML 更改为此以获得您想要的行为:

<div class=widget1>
    <div class=panel>panel1</div>
    <div class=panel>panel2
        <div class=widget2>
            <div class=panel>panel1</div>
            <div class=panel>panel2</div>
        </div>
    </div>
</div>

你的脚本是这样的:

var panels = $("div.widget1 > .panel");
alert(panels.length); // returns 2

var panels = $("div.widget2").children(".panel");
alert(panels.length); // returns 2

( demo )

关于jQuery 子选择器未按预期工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18751886/

相关文章:

jquery - 以固定大小比例调整 div 的大小

jquery - 通过 CSS 属性设置元素属性,这可能吗?

javascript - 想要根据下拉框选择显示/隐藏div

jquery - 仅将鼠标悬停在 1 个具有相同 jquery 类的元素上

javascript - jquery选择器按宽度

sorting - Elasticsearch如何按条件排序

javascript - 如何制作响应式图像?

javascript - jQuery 仅选择未嵌套在类似元素中的元素

LET block 内的嵌套 FLET block (反之亦然)

python - 如何在Python中将多个列表压缩到嵌套字典中