Quran Word by Word
let surah = 1;
let ayah = 1;
const arabicEl = document.getElementById(“arabic”);
const banglaEl = document.getElementById(“bangla”);
const wordEl = document.getElementById(“wordByWord”);
const audioEl = document.getElementById(“audio”);
const surahSelect = document.getElementById(“surahSelect”);
/* 114 সূরা লোড */
for (let i = 1; i <= 114; i++) {
let opt = document.createElement("option");
opt.value = i;
opt.text = "সূরা " + i;
surahSelect.appendChild(opt);
}
surahSelect.onchange = () => {
surah = surahSelect.value;
ayah = 1;
loadAyah();
};
async function loadAyah() {
/* Arabic + word by word */
const arRes = await fetch(
`https://api.quran.com/api/v4/verses/by_key/${surah}:${ayah}?words=true&translations=163`
);
const arData = await arRes.json();
arabicEl.innerHTML = arData.verse.text_uthmani;
banglaEl.innerHTML = arData.verse.translations[0].text;
wordEl.innerHTML = “”;
arData.verse.words.forEach(w => {
let span = document.createElement(“span”);
span.innerText = `${w.text_uthmani} (${w.translation.text})`;
wordEl.appendChild(span);
});
/* Audio */
audioEl.src = `https://cdn.islamic.network/quran/audio/128/ar.alafasy/${surah}${ayah}.mp3`;
}
function nextAyah() {
ayah++;
loadAyah();
}
loadAyah();