Forums

Board index » YUI 2.x: » Using YUI 2.x Components

Page 1 of 1   [ 2 posts ]
New Topic | Post Reply | Print view

Matt Parker

YUI Contributor

  • Username: mattatlamplight
  • Joined: Mon Apr 20, 2009 12:03 pm
  • Posts: 466
  • Location: London UK
  • GitHub: mattparker
  • Gists: mattparker
  • Online
  • Profile
Tags:

Selector - css3 :not()

Post Posted: Wed Jul 14, 2010 11:56 pm
+0-
Hi,

I'm having trouble with my css3 selectors. This is more a css question, rather than YUI, but anyway...

Given the html (it's a diary):
Code:
<div id="a1" class="event person1 person2">...</div>
<div id="a2" class="event person1">...</div>
<div id="a3" class="event person3">...</div>
<div id="a4" class="task">...</div>
<div id="a5" class="event person1 person3">...</div>


I want to select events involving person1, but not if they also involve person 2 or 3: ie. I want to
select #a2; but using class selectors. I can't find a way to do this with Selector.
Here's what I've tried and the results (in FF so far).

Code:
var S = YAHOO.util.Selector;

S.query("div.event.person1:not(.person2)");
// Gives #a2 & #a5... OK so far...

S.query("div.event.person1:not(.person2.person3)");
// Gives #a1 & #a2 & #a5

S.query("div.event.person1:not(.person2 .person3)");
// Gives #a1 & #a2 & #a5

S.query("div.event.person1:not(.person2):not(.person3)");
// Gives #a1 & #a2 & #a5

S.query("div.event.person1:not(.person2, .person3)");
// Gives every element in the document: :not() can only take simple selectors, I think, not multiple ones

S.query("div.event.person1:not(.person2), div.event.person1:not(.person3)");
// Gvies #a1, #a2 and #a5

I want to write :not(.person2 || .person3) , but I don't think you can!

Does anyone have any suggestions? Is the only way to do it
Code:
S.query("div.event.person1");

and then loop through checking for the other personX classes?

Thanks,

Matt

Don (少傑) Chiang

  • Username: donchiang
  • Joined: Sun May 20, 2012 11:33 pm
  • Posts: 1
  • Offline
  • Profile
Tags:

Re: Selector - css3 :not()

Post Posted: Sun May 20, 2012 11:42 pm
+1-
yes you are right you can't use groups of selectors with negation:

http://www.w3.org/TR/css3-selectors/#negation

you should use simple selector instead:

http://www.w3.org/TR/css3-selectors/#si ... ectors-dfn

so :not(.person1, .person2) won't work. you have to write it like:

:not(.person1):not(.person2)

to filter out both person1 and person2
Page 1 of 1   [ 2 posts ]
New Topic | Post Reply | Print view
Display posts from previous:  Sort by  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum

Recent Forums Posts

Recent YUI Blog Posts

Online Users

© 2006-2013 Yahoo! Inc. All rights reserved.
All code on this site is licensed under the BSD License unless stated otherwise.
About This Site · Security Contact Info

Powered by phpBB® Forum Software © phpBB Group