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, Jul 26 '15 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, Jul 26 '15 at 14:05
the problem with try/catch is that I don't know what's wrong with it besides that it is wrong — Nick Ginanto, Jul 26 '15 at 14:07
you can catch exception string and compare to know exatly which exception occured. — vinayakj, Jul 26 '15 at 14:09
To make question clearer, do you want to check for valid jQuery selectors or CSS ones? — A. Wolff, Jul 26 '15 at 14:15

score 7 · Answer 1 · answered Jul 26 '15 at 14:09

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 '15 at 14:09

Jaromanda X

1
4
64
78

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 Jul 26 '15 at 14:11
In fact, question isn't clear about it: `Validation of a javascript/css selector` & `javascript/jquery selector` – A. Wolff Jul 26 '15 at 14:14
Here’s [a fiddle](http://jsfiddle.net/meqruLzr/1/) based on your method to test selectors for validity. – Jed Fox Dec 11 '15 at 23:39
https://stackoverflow.com/q/71303374 – CertainPerformance Mar 01 '22 at 03:30

MstfAsan · Answer 2 · 2015-07-26T15:25:23.597

-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 '15 at 15:25

answered Jul 26 '15 at 15:00

MstfAsan

3,679
2
22
34

score -5 · Answer 3 · answered Jul 26 '15 at 14:05

-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 '15 at 14:05

Nabi

744
1
9
22

this doesn't check for validation, as in given a selector tell me if its good or not – Nick Ginanto Jul 26 '15 at 14:05

Validation of a css selector

3 Answers3

Linked