开发者

select all X type of elements but not the same type again inside them

for example, if there are several DIV elements, one inside another. lets say 3 levels.

how would you go about selecting only the 2nd level of Divs, not knowing how deep they might be,

and not able to give more classes?

// html example of a possible DOM
<div class="level1'>
    <a>
        <div>
            <a>
                <div></div>
            </a>
        </div>
    </a>
    <a>
        <div></div>
    </a>
</div>

selectors overview:

div.level1 > div => (BAD) would return nothing because Div is inside a

div.level1 > a > div => (BAD) the 2nd level div's might be deeper, and the exact xpath should not be written

is there some kind of CSS selector combinations that would return 'find the elements but never go find inside th开发者_Python百科em', so then div.level1 div will return only the 2nd-level Divs but not the ones that might be inside them (something of that sort). I find this a very powerful thing to have.


Not likely.
But what you can do is set desired property on the level >= 2 (div.level1 div) and negate it on all the divs below level 2 (div.level1 div div).

Of course, there's always an option of using different classes for each level.


Your first selector looks absolutely fine. Just check out this example CSS:

<style type="text/css">
    a, div {
        display: block;
        margin: 10px;
        border: 1px solid grey;
        background-color: red
    }
    div.level1 > div {
        background-color: green;
    }
</style>

Only the second level DIV is matched as it is a direct child of the div.level1.

BTW: Your HTML makes no sense at all. DIVs inside of inline elements are bad. But links inside of links are even worse :)

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜