CSS selector case insensitive for attributes

jquery jquery-selectors css-selectors case-insensitive selenium-webdriver
Alp picture Alp · Apr 15, 2011 · Viewed 24.3k times · Source

If I have an HTML element <input type="submit" value="Search" /> a css selector needs to be case-sensitive:

input[value='Search'] matches

input[value='search'] does not match

I need a solution where the case-insensitive approach works too. I am using Selenium 2 and Jquery, so answers for both are welcome.

Answer

Robert Siemer picture Robert Siemer · Nov 3, 2014

CSS4 (CSS Selector Level 4) adds support for it:

input[value='search' i]

It's the "i" at the end which does the trick.

Broader adoption started mid-2016: Chrome (since v49), Firefox (from v47?), Opera and some others have it. IE not and Edge since it uses Blink. See “Can I use”...

Related questions

jQuery first child of "this"

I'm trying to pass "this" from a clicked span to a jQuery function that can then execute jQuery on that clicked element's first child. Can't seem to get it right... <p onclick="toggleSection($(this));"><span class="redClass"&…

Read More
jQuery: select an element's class and id at the same time?

I've got some links that I want to select class and id at the same time. This is because I've got 2 different behaviours. When a class of links got one class name they behave in one way, when the same …

Read More
jQuery vs document.querySelectorAll

I heard several times that jQuery's strongest asset is the way it queries and manipulates elements in the DOM: you can use CSS queries to create complex queries that would be very hard to do in regular javascript . However , as …

Read More