Estoy intentando cambiar el valor de propiedad de la clase CSS. Estoy usando esta solución:
let pizzas = document.querySelectorAll('.pizza'); pizzas.forEach( pizzaElement => pizzaElement.style.display = 'none' );¿Alguien tiene una solución sin iteración de uso?
Es mejor usar la API classList con la posibilidad de agregar, eliminar o alternar clases CSS: https://developer.mozilla.org/en-US/docs/Web/API/Element/classList
let pizzas = document.querySelectorAll('.pizza'); pizzas.forEach( pizzaElement => pizzaElement.classList.add('d-none') );EDITAR: Describa exactamente dónde desea usarlo. Si no desea cambiar la propiedad de ningún evento, no es necesario hacerlo con JS. Puede sobrescribir css o agregar una nueva clase.
si está usando JavaScript puro, puede usar este código:
let pizzas = document.querySelectorAll('.pizza'); pizzas[0].style.display = 'none'; pizzas[1].style.display = 'none'; pizzas[2].style.display = 'none';o si está usando JQuery , puede usar esto:
$(document).ready(function(){ $('.pizza').css('display','none'); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <DOCTYPE html> <head> </head> <body> <div class="pizza">Some Text</div> <div class="pizza">Some Other Text</div> <div class="pizza">Text</div> </body> </html>