javascript - queryselector - selector jquery

¿Por qué jQuery 3 no puede identificar el carácter ''#'' en un selector de atributos?

Question

Acabo de intentar cambiar mi aplicación a jQuery 3. Estaba pasando por algunas pruebas y todo estaba funcionando como esperaba, hasta que llegué a una parte de mi aplicación que usaba un símbolo ''#'' en un selector. Tengo una pieza de jQuery que se ve así:

var $existingFilter = $container.find(''.filterFeedItem[data-component-type=#somefilter]'');

Usando jQuery 3 me sale un error:

jquery-3.0.0.js:1529 Uncaught Error: Syntax error, 
unrecognized expression: .filterFeedItem[data-component-type=#somefilter]

¿Alguien sabe por qué jQuery ya no puede analizar los selectores que contienen este símbolo?

Answer 1

Según la documentación de jQuery , el valor del atributo:

Puede ser un identificador válido o una cadena entre comillas.

El identificador válido es cualquier identificador css válido:

https://www.w3.org/TR/CSS21/syndata.html#value-def-identifier

En CSS, los identificadores (incluidos nombres de elementos, clases e ID en selectores) pueden contener solo los caracteres [a-zA-Z0-9] e ISO 10646 caracteres U + 00A0 y superiores, más el guión (-) y el guión bajo ( _) ; no pueden comenzar con un dígito, dos guiones o un guión seguido de un dígito. Los identificadores también pueden contener caracteres escapados y cualquier carácter ISO 10646 como un código numérico (consulte el siguiente elemento). Por ejemplo, el identificador "B & W?" puede escribirse como "B / & W /?" o "B / 26 W / 3F".

Como quiere usar # , necesita escapar o citar el valor:

                         //Note the quotes v --------- v
.find(''.filterFeedItem[data-component-type="#somefilter"]'');

Answer 2

Tenga en cuenta que el cambio aparentemente tuvo lugar en la versión 2.0, como elemento devuelto de la versión 2.1.3 utilizando selector

var $existingFilter1 = $container.find(''.filterFeedItem[data-component-type=#somefilter]'');

jsfiddle https://jsfiddle.net/f8nej922/2/

Aunque no se han podido encontrar referencias específicas o descripciones de cambios en jQuery 2.2 y 1.12 Documentación liberada .

Como se señala en @BoltClock, el cambio está relacionado con Selector: elimina la excepción "#" para los tokens de identificador .

Puedes eliminar # personaje con // ; valor de cotización en el selector de atributos; o use $.escapeSelector()

var $existingFilter = $container
                      .find(''.filterFeedItem[data-component-type=//#somefilter]'');

var $existingFilter = $container
                      .find(''.filterFeedItem[data-component-type="#somefilter"]'');

var $existingFilter = $container
                      .find(''.filterFeedItem[data-component-type='' 
                       + $.escapeSelector(''#somefilter'') + '']'');

jsfiddle https://jsfiddle.net/f8nej922/4/