<!DOCTYPE html>
.resaltado { background-color:yellow; }
/*
El atributo puede ser 'anim' o 'bn'
*/
function resaltar(atributo) {
const pelis = document.querySelectorAll('#pelis li');
for (const li of pelis) {
li.className = "";
if (atributo == 'anim') {
if (li.dataset.anim == "S") {
li.className = "resaltado";
}
} else if (atributo == 'bn') {
if (li.dataset.bn == "S") {
li.className = "resaltado";
}
}
}
}
function generizar(genero) {
const pelis = document.querySelectorAll('#pelis li');
for (const li of pelis) {
li.className = "";
const arrayGeneros = li.dataset.gen.split(' ');
if (arrayGeneros.includes(genero)) {
li.className = "resaltado";
}
}
}
<li data-anim="S" data-gen="familiar muerte">Coco
</li> <li data-anim="S" data-gen="cuento ogro">Shrek
</li> <li data-bn="S" data-gen="stopmotion">King Kong
</li> <li data-anim="S" data-gen="lampara genio">Aladdin
</li> <li data-gen="playa muerte">Tiburón
</li> <li data-gen="arena gusano">Dune
</li> <li data-bn="S" data-gen="vampiro">Nosferatu
</li> <li data-bn="S" data-gen="stopmotion">Godzilla
</li> <li data-anim="S" data-gen="robot">Mazinger
</li> <li data-anim="S" data-gen="robot">Evangelion
</li> Género:
<button onclick="generizar('stopmotion')">stopmotion
</button>