Combining Different Attribute Selector in Jquery

Question

Is is possible to do something like this in Jquery?

$("a[data-tooltip-content*!='Public')")    - not containing any substring of "Public"

intended code:

$("a[data-tooltip-content!*='Public'][data-tooltip-content!*='Only Me'][data-tooltip-content!*='friends']").closest(".userContentWrapper._5pcr,._2tdc").css({"background-color": "violet"});
$("a[data-tooltip-content*='Public']").closest(".userContentWrapper._5pcr,._2tdc").css({"background-color": "yellow"});
$("a[data-tooltip-content*='Only Me']").closest(".userContentWrapper._5pcr,._2tdc").css({"background-color": "lime"});
$("a[data-tooltip-content*='friends']").closest(".userContentWrapper._5pcr,._2tdc").css({"background-color": "cyan"});

1st line: if ("Public","Only Me","friends") are not found, set colour to "Violet"

Have you tried? And, if you do, make sure the selector you write is valid (the one you've shown isn't); — Scott Marcus
– Scott Marcus, Commented Dec 2, 2016 at 15:32
there's nothing wrong with it?? i have tried it but it's not working!! — jona
– jona, Commented Dec 2, 2016 at 15:34
i have just tried to recode it again, this selector is definitely valid because i am able to invoke css background colour to 'Facebook Statuses' except the first line of code (violet), and i have tried console.log between the first line of code, and it appears that the programme will stopped running after i runs the differentmultiple attribute selector — jona
– jona, Commented Dec 2, 2016 at 15:42
The selector is definitely NOT valid. There is something wrong with it... You are missing the closing square bracket. — Scott Marcus
– Scott Marcus, Commented Dec 2, 2016 at 15:42
And the closing quote mark. Although I'm amazed that works at all, given the !*= syntax. — David Thomas
– David Thomas, Commented Dec 2, 2016 at 15:43

Dekel · Accepted Answer · 2016-12-02 15:40:28Z

2

Your problem is probably not with multiple attribute selectors, but with the not selector (which doesn't exists).

You can't use the ! for "not contains", however you can use the :not([class*="Public"]).

Here is a working example (is just a css example, but works exactly the same with jQuery's css selectors:

div {
  background: red;
}
div:not([class*="asd"]) {
  background: green;
}

<div class="asd">123</div>
<div class="dsa">456</div>
<div class="">789</div>

answered Dec 2, 2016 at 15:40

Dekel

62.9k12 gold badges109 silver badges130 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

jona Over a year ago

thanks for the help!!! :) can i get an opinion in changing the title of this post to a better title to prevent misleading of question?

retoheusser · Accepted Answer · 2016-12-02 15:40:42Z

2

You can make use of jQuery's :not()-Selector

$("a:not([data*='Public'])");

answered Dec 2, 2016 at 15:40

retoheusser

934 bronze badges

Comments

roberrrt-s · Accepted Answer · 2016-12-02 15:41:53Z

1

Yes, using :not()

$('a:not([data-tooltip-content*="public"])')

Select all <a> tags that do not contain a data attribute that contains post

$('a:not([data-tooltip-content*="public"])').css('background-color', '#f00')

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" data-tooltip-content="public">a link</a>
<a href="#" data-tooltip-content="private">another link</a>
<a href="#" data-tooltip-content="help me">aaaaanother link</a>
<a href="#" data-tooltip-content="public thingy">abbbnother link</a>

answered Dec 2, 2016 at 15:41

roberrrt-s

8,2502 gold badges49 silver badges61 bronze badges

Collectives™ on Stack Overflow

Combining Different Attribute Selector in Jquery

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related