Validation of a css selector

Question

Is there a way to programmatically check the validity of a javascript/jquery selector?

like .class is ok but .class, is not

programmatically in javascript or any backend language (besides going through jQuery source code)

so in pseudo code

 def selectorErrors(selector)

     // do nasty stuff to the selector
     if valid?
      return nil
    else
      return errors
    end
end

exactly my point. Is there a way to programmatically solve this arguement? — Nick Ginanto
– Nick Ginanto, Commented Jul 26, 2015 at 14:01
how about a try/catch on document.querySelector(str) - less overhead than jQuery, although there are some jQuery specific "selectors" that querySelector wont allow — Jaromanda X
– Jaromanda X, Commented Jul 26, 2015 at 14:05

Jaromanda X · Accepted Answer · 2015-07-26 14:09:11Z

7

This should validate 99% of what you can throw at jQuery with far less overhead

function validateQuery(str) {
    try {
        document.querySelector(str);
        return true;
    }
    catch(e) {
        // something here to check WHY it's invalid
    }
    return false;
}

edit: ok, this wont tell you WHAT is wrong with it, but it does (quickly) check the validity - at least you'll only need to check WHY it's invalid, not IF :p

answered Jul 26, 2015 at 14:09

Jaromanda X

57.1k6 gold badges82 silver badges96 bronze badges

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

4 Comments

A. Wolff Over a year ago

Instead of document.querySelector(str); shouldn't it just be: jQuery(str);? Because ya, jQuery has some pseudo selectors (':has(), ':eq()', etc...) not supported by document.querySelector() method

A. Wolff Over a year ago

In fact, question isn't clear about it: Validation of a javascript/css selector & javascript/jquery selector

Jed Fox Over a year ago

Here’s a fiddle based on your method to test selectors for validity.

CertainPerformance Over a year ago

stackoverflow.com/q/71303374

Mustafa ASAN · Accepted Answer · 2015-07-26 15:25:23Z

-2

existOrValid('#a')

function existOrValid(a){

    if (/^[#,.]{0,1}[A-Za-z][0-9A-Za-z\-\._:]*$/.test(a)) {
    alert('valid');
}

}

Works on simple class ,id selectors but needs modification for nested queries

edited Jul 26, 2015 at 15:25

answered Jul 26, 2015 at 15:00

Mustafa ASAN

3,8552 gold badges27 silver badges34 bronze badges

Comments

Nabi · Accepted Answer · 2015-07-26 14:05:00Z

-5

$('.a.b')

If you want an intersection, just write the selectors together without spaces in between. So for an element that has an ID of a with classes b and c, you would write:

$('#a.b.c')

answered Jul 26, 2015 at 14:05

Nabi

7641 gold badge10 silver badges22 bronze badges

1 Comment

Nick Ginanto Over a year ago

this doesn't check for validation, as in given a selector tell me if its good or not

Collectives™ on Stack Overflow

Validation of a css selector

3 Answers 3

4 Comments

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related