Estoy usando el siguiente javascript para escribir porciones de código según el idioma del navegador de los visitantes.
Pero he notado que el hecho de que ambos JS usen los mismos comandos (solo condiciones diferentes) causa un conflicto, por lo que solo el primero en la lista funcionará correctamente.
¿Como puedo resolver esto?
<script> const modifyElHTML = (elID, phrases) => { const el = document.getElementById(elID); let phrase; if (italian) {phrase = phrases.italian; } else if (french) {phrase = phrases.french; } else if (german) {phrase = phrases.german; } else {phrase = phrases.english; } el.innerHTML = `${phrase}`; }; modifyElHTML('comentario', {italian: 'Scrivi un commento...', french: 'Ajouter un commentaire...', german: 'Kommentieren ...', english: 'Write an answer...',}); </script> <script> const modifyElHTML = (elID, phrases) => { const el = document.getElementById(elID); let phrase; if (italian) {phrase = phrases.italian; } else if (french) {phrase = phrases.french; } else if (german) {phrase = phrases.german; } else {phrase = phrases.english; } el.innerHTML = `<button class="_1gl3 _4jy0 _4jy3 _517h _51sy _42ft" type="submit" value="1"><span>${phrase}</span></button><a href="#" onclick="exit_alert()"></a>`; }; modifyElHTML('showmorecomments', { italian: 'Carica altri 10 commenti', french: 'Chargez 10 autres avis', german: '10 weitere Kommentare laden', english: 'Load 10 more comments',}); </script>Si solo le preocupan los nombres de variables en conflicto, puede usar un cierre ... o en la jerga de JS, un IIFE .
(function(){ const modifyElHTML = (elID, phrases) => { const el = document.getElementById(elID); let phrase; if (italian) {phrase = phrases.italian; } else if (french) {phrase = phrases.french; } else if (german) {phrase = phrases.german; } else {phrase = phrases.english; } el.innerHTML = `${phrase}`; }; modifyElHTML('comentario', {italian: 'Scrivi un commento...', french: 'Ajouter un commentaire...', german: 'Kommentieren ...', english: 'Write an answer...',}); })(); (function(){ const modifyElHTML = (elID, phrases) => { const el = document.getElementById(elID); let phrase; if (italian) {phrase = phrases.italian; } else if (french) {phrase = phrases.french; } else if (german) {phrase = phrases.german; } else {phrase = phrases.english; } el.innerHTML = `<button class="_1gl3 _4jy0 _4jy3 _517h _51sy _42ft" type="submit" value="1"><span>${phrase}</span></button><a href="#" onclick="exit_alert()"></a>`; }; modifyElHTML('showmorecomments', { italian: 'Carica altri 10 commenti', french: 'Chargez 10 autres avis', german: '10 weitere Kommentare laden', english: 'Load 10 more comments',}); })();Puede agregar un parámetro para mostrar un botón o un texto
let lang; // lang = "italian"; // shorter than italian = true etc const modifyElHTML = (elID, phrases, button) => { const el = document.getElementById(elID); const phrase = phrases[lang||"english"]; // added default language if lang not set el.innerHTML = button ? `<button class="_1gl3 _4jy0 _4jy3 _517h _51sy _42ft" type="submit" value="1"><span>${phrase}</span></button><a href="#" onclick="exit_alert()"></a>` : `${phrase}`; }; modifyElHTML('comentario', { italian: 'Scrivi un commento...', french: 'Ajouter un commentaire...', german: 'Kommentieren ...', english: 'Write an answer...', }); modifyElHTML('showmorecomments', { italian: 'Carica altri 10 commenti', french: 'Chargez 10 autres avis', german: '10 weitere Kommentare laden', english: 'Load 10 more comments', }, true); // button = true <div id="comentario"></div> <div id="showmorecomments"></div>