Tratando de trabajar con la navegación de la galería de un solo producto. Este es el sitio web de Woocommerce.
Aquí está el código HTML de esta área:
Lo siento, pero no puedo copiarlo desde el origen de la página, porque no existe ese código. Estoy tratando de obtener ol.flex-control-nav usando este código:
console.log('ok'); let addImagesLength = document.querySelectorAll('.woocommerce-product-gallery ol'); console.log(addImagesLength); Usando "ok" en el registro de la consola para estar seguro, ese código es correcto antes. Entonces, todo lo que obtengo en el registro es una lista de nodos vacía. Supongo que ese ol.flex-control-nav aparece después de cargar el archivo .js . Una cosa que también me gustaría mencionar es que la sección de navegación de la galería de productos se llama en la página wwocommerce.php usando este fragmento:
function web_add_woocommerce_support() { add_theme_support( 'woocommerce' ); } add_theme_support( 'wc-product-gallery-slider' ); add_action( 'after_setup_theme', 'web_add_woocommerce_support' ); Así que asumo que este fragmento de código carga la navegación de la galería después de que el archivo .js se haya cargado por completo. Estaba tratando de poner en cola un archivo .js separado después de este código PHP, pero el resultado es el mismo. Si es así, ¿cómo puedo resolver este problema?
Resolvió este problema agregando poner todas las funciones en window.onload .
window.onload = function () { console.log('ok'); let addImagesLength = document.querySelectorAll('.flex-control-nav'); console.log(addImagesLength); }