Intenté seguir la información aquí , editándola para que coincida con mis necesidades, pero hasta ahora no funciona. Estoy tratando de ocultar un div principal con dos elementos secundarios. El div principal es parte de una lista, todos con las mismas clases, y cada div tiene dos elementos secundarios: una entrada y una imagen. Cada entrada tiene una "etiqueta de wapf de datos" única que estoy tratando de seleccionar para poder ocultar el div principal. El HTML es el siguiente:
<div class="has-pricing wapf-swatch wapf-swatch--image"> <input type="radio" id="wapf-field-61b148f2fc8fe_lzhx7" name="wapf[field_61b148f2fc8fe]" class="wapf-input" data-field-id="61b148f2fc8fe" value="lzhx7" data-wapf-label="Peppermint Mocha" data-is-required data-wapf-pricetype-"fx"> <img src="..."> </div>Hay varias páginas donde aparece este producto, y en lugar de ingresar y eliminar el campo del producto (porque tendré que agregarlo nuevamente la próxima temporada), estoy tratando de crear un código que ocultará todo el divs para todos los productos que tienen el código anterior (dado que cada uno tiene una "identificación" única, tendría que hacerlo varias veces para cada identificación usando "selectElementById", y me gustaría evitar hacer eso, obviamente).
Instalé Code Snippets, pero tengo algunos problemas con Javascript. Debo agregar que Code Snippets inserta código en el sitio web a través de php (por lo que se requieren etiquetas php con cada fragmento). He probado varias cosas, pero esta es mi última versión. Lanza un error de sintaxis "'hideFlavors' inesperado (T_STRING), esperando '('". Aquí está mi código php/Javascript:
<?php add_action( 'wp_head', function hideFlavors() { ?> <script> if var peppermintMocha = document.querySelectorAll("[data-wapf-label='Peppermint Mocha']") { peppermintMocha.parentNode.style.display = "none"; } </script> <?php } );También lo probé con "document.querySelector" (sin "All"), pero con el mismo problema o uno similar. Cuando obtengo el código para pasar sin ningún error, todavía no soluciona el problema. En este punto, me siento un poco como el tipo que mira a través del periscopio del tanque en el "Día de la Independencia". No importa lo que haga, "el objetivo permanece".
<?php add_action( 'wp_head', function() { ?> <script> window.onload = function() { document.querySelectorAll("[data-wapf-label='Peppermint Mocha']").forEach(function(el) { el.parentNode.style.display = "none"; }); }; </script> <?php }); ?> querySelectorAll devuelve una matriz de elementos, por lo que debe recorrer cada elemento y ocultar su padre respectivamente.
En su lugar querySelectorAll usa querySelector . Entonces sería trabajo. Pero asegúrese de que exista solo un campo de entrada con el selector [data-wapf-label='Peppermint Mocha'] .