jquery - 检查特定的父选择器是否存在

Question

我有以下 html，其中包含 2 个面板。我只想将 CSS 应用于外部 ky 面板和 ky 面板主体。我怎样才能做到这一点？我想这样做的原因是因为面板主要有通用的 CSS，但我想在嵌套面板时更改一些东西。

<div class="ky-panel">
    <div class="ky-panel-body">
        <div class="ky-panel">
            <div class="ky-panel-body">
                some HTML with some CSS
            </div>
        </div>
    </div>
</div>

我尝试了以下 CSS，但它不起作用:

@mixin ky-panel-body {
    @if & {
        some CSS
    }
}

Answer 1

对我来说，如果你保持这样的结构，除了将你的 CSS 应用到 ky-panel-body 和 ky-panel 并恢复如果它们是嵌套的:

.ky-panel{
    border: 1px solid black; //Just an example

    .ky-panel-body{
        color: red; //Just an example

        .ky-panel{
            border: inherit; //Revert your changes

            .ky-panel-body{
                color: inherit; //Revert your changes
            }
        }
    }
}