Я хочу сделать свой ванильный HTML, CSS и JavaScript E-Commerce поставляется с раскрывающимся списком с несколькими язык ⇐ Javascript

[Anonymous]

Я хочу составить раскрывающий список со всеми языками, а выбранные языки будут переведены автоматически, как использование API Google Translate вместо того, чтобы сделать атрибуты [data-en] или [data-ar] для перевода текстового содержимого вручную. < /h1>
Это пример перевода, который я делаю .. < /p>
Это пример перевода.// Language Switcher
const langButtons = document.querySelectorAll('.lang-btn');

langButtons.forEach(button => {
button.addEventListener('click', function() {
const lang = this.getAttribute('data-lang');

// Update active button
langButtons.forEach(btn => btn.classList.remove('active'));
this.classList.add('active');

// Update language attributes
document.body.setAttribute('data-lang', lang);
document.body.setAttribute('dir', lang === 'ar' ? 'rtl' : 'ltr');

// Update all text elements
updateTextContent(lang);
});
});

// Function to update text content based on language
function updateTextContent(lang) {
const elements = document.querySelectorAll('[data-en], [data-ar]');

elements.forEach(element => {
if (lang === 'en') {
if (element.hasAttribute('data-en')) {
if (element.tagName === 'INPUT' || element.tagName === 'TEXTAREA') {
element.setAttribute('placeholder', element.getAttribute('data-en'));
} else {
element.textContent = element.getAttribute('data-en');
}
}
} else if (lang === 'ar') {
if (element.hasAttribute('data-ar')) {
if (element.tagName === 'INPUT' || element.tagName === 'TEXTAREA') {
element.setAttribute('placeholder', element.getAttribute('data-ar'));
} else {
element.textContent = element.getAttribute('data-ar');
}
}
}
});
}
< /code>




ABC Therapy


Home
Testimonials
Services
About
Contact


Book Appointment




< /code>
HTML Document to tranlate only from English to Arabic or vice versa

Подробнее здесь: https://stackoverflow.com/questions/797 ... comes-with