Soy nuevo en JS, pero esperaba que hubiera un selector como document.getElementsByClassName("div:not(div-1)") que selecciona elementos por nombre de clase, a menos que también tengan otro nombre de clase, que puedo definir.
Básicamente mi proyecto es una lista de películas y sus géneros.
Usando una función onclick , si hace clic en un género, estoy tratando de ocultar todas las demás películas que no pertenecen a ese género. Ahora estoy buscando una manera de seleccionar los DIV sin tener que agregar una clase de "no comedia", "no acción", etc. a cada película.
Hasta ahora tengo esto:
function test() { var x = document.getElementsByClassName("movie-div"); var i; for (i=0; i < x.length; i++) { if (x[i].style.display === "none") { x[i].style.display = "block"; } else { x[i].style.display = "none"; } } }Use querySelectorAll con ie: el selector :not()
const ELS_x = document.querySelectorAll(".x:not(.zzz)"); ELS_x.forEach(EL => { // do something with EL EL.classList.toggle("active"); }); .active {background: gold;} <div class="x">a</div> <div class="x zzz">b</div> <div class="x">a</div>o si desea realizar la verificación de clase dentro del ciclo, use classList.contains()
const ELS_x = document.querySelectorAll(".x"); ELS_x.forEach(EL => { if (!EL.classList.contains("zzz")) { // do something with NON .zzz Elements EL.classList.toggle("active"); } }); .active {background: gold;} <div class="x">a</div> <div class="x zzz">b</div> <div class="x">a</div>si desea filtrar algunos Elementos, use .filter()
const ELS_x = document.querySelectorAll(".x"); const ELS_without_zzz = [...ELS_x].filter(EL => !EL.classList.contains("zzz")); ELS_without_zzz.forEach(EL => { // do something with NON .zzz Elements EL.classList.toggle("active") }); .active {background: gold;} <div class="x">a</div> <div class="x zzz">b</div> <div class="x">a</div>