Estoy tratando de seleccionar una clase con un atributo específico en JavaScript, como se muestra a continuación:

 var me = document.querySelector('.tab-content[data-tab=1]');

Pero obteniendo el siguiente error:

 Uncaught DOMException: Failed to execute 'querySelector' on 'Document': '.tab-content[data-tab=1]' is not a valid selector.

Intenté cambiarlo a jQuery:

 $('.tab-content[data-tab=1]')

Entonces funcionará.

Traté de cambiarlo agregando comillas dobles:

 var me = document.querySelector('.tab-content[data-tab="1"]');

Entonces también funcionará.

Revisé el selector de atributos en W3 Schools y en sus ejemplos hay [target=_blank] , que no requiere comillas dobles.

Entonces, ¿por qué la eliminación de comillas dobles no funciona para JavaScript?