Estoy haciendo una especie de buscador de etiquetas pero el problema es que solo me muestra un resultado.
Si busco ‘hola’ debería salirme los 3, ya que los 3 tienen la misma etiqueta lo mismo con ‘color’ pero sólo me sale uno como ya lo dije, igualmente también quisiera saber cómo buscar varias etiquetas a la vez, ejemplo buscar hola, -otra etiqueta – etc… y salga todos, ya lo intenté y no funciona a menos que haga esto al momento de buscar red + .blue me mostrará finalmente el div class blue.
No tengo idea cuando usar querySelector y querySelectorAll, intenté con este último también, pero no funciona como lo hace querySelector
function buscar(){ var buscar = document.getElementById("search").value; var result = document.querySelector('.' + buscar); result.style.display = "block"; }
.hola{ width: 50px; height: 50px; display: none; } .red{ background-color: red; } .blue{ background-color: blue; } .yellow{ background-color: yellow; }
<input id="search" type="text" placeholder="Buscar..."> <button onclick="buscar()">Buscar</button> <br/> <br/> <div class="hola color red"></div> <div class="hola color blue "></div> <div class="hola color yellow"></div>