Chargement dynamique du script FAQ avec loadChattyPage dans le document elem

// La fonction loadChattyPage est conçue pour charger dynamiquement un script externe qui gère la section FAQ de la page.

// Elle crée un nouvel élément 'elem' de type script, en lui attribuant le chemin d'accès vers le fichier JavaScript hébergé sur Shopify.

// La propriété 'src' de cet élément inclut une variable de version basée sur la date actuelle (new Date().getTime()), ce qui garantit que le navigateur récupère la dernière version du script, évitant ainsi tout cache obsolète.

// L'insertion de ce script se fait avant le premier script existant sur la page, identifié par 'firstScript', ce qui optimise le chargement et l'exécution pour une expérience utilisateur fluide.

// Lors du chargement du document (événement 'DOMContentLoaded'), la fonction loadChattyPage est automatiquement appelée, assurant que la section FAQ est prête à l'emploi dès que la page est complètement chargée.

function loadChattyPage() {

const elem = document.createElement('script'); // Création dynamique d'un élément 'script' pour charger le script FAQ.

elem.type = 'text/javascript'; // Définition du type de script pour assurer la compatibilité.

elem.src = 'https://cdn.shopify.com/extensions/505ce933-6eff-47ee-a32f-dee5ae134593/0.0.0/assets/avada-page-faqs.min.js?shop=cothingshop.myshopify.com&v=' + new Date().getTime(); // URL du script avec un paramètre 'v' qui inclut un timestamp pour forcer le rafraîchissement du cache.

// Identification du premier script existant dans le document, utilisé comme point d'insertion pour le nouveau script.

const firstScript = document.getElementsByTagName('script')[0];

// Insertion du nouvel élément 'elem' juste avant 'firstScript', ce qui garantit que le script FAQ sera chargé rapidement et efficacement sans bloquer le rendu de la page.

firstScript.parentNode.insertBefore(elem, firstScript);

}

// L'événement 'DOMContentLoaded' assure que la fonction loadChattyPage est appelée dès que la structure DOM est complètement chargée, sans attendre le chargement complet des ressources externes, ce qui optimise la performance.

document.addEventListener('DOMContentLoaded', () => loadChattyPage());