Re: Parent Combinator / Parent pseudo-class

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 UTC