W3C home > Mailing lists > Public > www-style@w3.org > July 2008

Re: Parent Combinator / Parent pseudo-class

From: Francois Remy <fremycompany_pub@yahoo.fr>
Date: Sat, 26 Jul 2008 12:11:14 +0200
Message-ID: <12C0BAC5E585444CB421B30839D0D634@FremyCompany1>
To: "Andrew Fedoniouk" <news@terrainformatica.com>, "Tab Atkins Jr." <jackalmage@gmail.com>
Cc: "Brad Kemper" <brkemper@comcast.net>, "Boris Zbarsky" <bzbarsky@mit.edu>, "www-style list" <www-style@w3.org>

From: "Andrew Fedoniouk" <news@terrainformatica.com>
>
> Tab Atkins Jr. wrote:
>> On Fri, Jul 25, 2008 at 10:56 AM, Brad Kemper <brkemper@comcast.net 
>> <mailto:brkemper@comcast.net>> wrote:
>>
>>
>>     Consider the following:
>>
>>     div:with-child(code) { border:2px solid #999;
>>     background-color:beige; }
>>     div:with-child(code):before { content:"See Code:"; }
>>
>>     I would only want this on DIVs that surrounded the Code block
>>     directly, not on any old DIV that happened to be an ancestor of
>>     the code block.
>>
>>
>> Nod, searching for just children would certainly be useful.  That's why 
>> my proposal was for a simple selector preceded by a combinator.  You'd do 
>> this:
>>
>> div:matches( > code ) { border:2px solid #999; background-color:beige; }
>> div:matches( > code ):before { content:"See Code:"; }
> That is again subject of :root/:scope debate :)
>>
>>     I can really see no use case for a "has-child" pseudo-class to
>>     look at all descendants.
>>
>>
>> Really?  I can.  I probably wouldn't ever want to use a plain descendant 
>> selector on something like a plain div, but I could easily see this being 
>> used on a more complex element about which you have a greater knowledge 
>> of it's use.  Frex:
>
> As a solution: http://www.terrainformatica.com/?p=100

CSS! is the most complex and most hypotetical proposal of the CSS WG...
And, sorry but if it's to do something so, we can do it by JScript too.
(and JScript is implemented in all browsers while CSS! in none)

document.querySelectorAll('li').forEeach(function (el) {
    el.setAttribute('has-a-inside', el.querySelector('a') != null);
});

And if there's a DOMModified event added to elements, we can do much better 
:

function updateLI(el) {
    el.setAttribute('has-a-inside', el.querySelector('a') != null);
}

document.addEventListener("DOMNodeInserted", function(e) {
    var el = e.target;
    if (el.tagName=="A") {
        while (el) {
            if (el.tagName=="LI") {
                updateLI(el);
            }
            el = el.parentNode;
        }
    }  else if (el.tagName=="LI") {
        updateLI(el);
    }
});

document.addEventListener("DOMNodeRemoved", function(e) {
    var el = e.target;
    if (el.tagName=="A") {
        while (el) {
            if (el.tagName=="LI") {
                updateLI(el);
            }
            el = el.parentNode;
        }
    }
});

And we have [have-a-inside] maintained up-to-date....

>
> Cheers.
>
> --
>
> Andrew Fedoniouk.
>
> http://terrainformatica.com
> 
Received on Saturday, 26 July 2008 10:11:52 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:55:10 GMT