¿Cómo puedo obtener información (número de página) del usuario y luego buscar el texto correspondiente que tiene ese número de página y mostrárselo al usuario usando esta API = https://api.alquran.cloud/v1/page/${ numero}/quran-uthmani
Si te entiendo claramente, entonces necesitas esto:
async function getVersesforpage(number) { //to get verses for a certain pagetry try { const url = `https://api.alquran.cloud/v1/page/${number}/quran-uthmani`; const response = await fetch(url); const data = await response.json(); const ayahs = data.data.ayahs; const verses = ayahs.map(ayah => ayah.text); return verses; } catch (e) { console.log("Error:", e.message) } } const form = document.getElementById("form"); form.addEventListener("submit", async(event) => { event.preventDefault(); const { number } = event.target.elements; const value = number.value; const verses = await getVersesforpage(value); console.log(verses); }); <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>بصائر</title> <link href="css/stylesheet1.css" rel="stylesheet"> <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> <link href="css/img/logo1.png" rel="icon"> <script type="module"></script> </head> <body> <header class="header"> <form id="form"> <label for="number">رقم الصفحة</label> <input id="number" placeholder="Search.." type="number"> <button class="fa fa-search" type="submit"></button> </form> </header> <!--<script src="https://unpkg.com/localbase/dist/localbase.dev.js"></script>--> <script src="js/main.js"></script> </body> </html>Puede obtener el valor de usuario de cualquier campo por identificación archivada usando document.getElementById('idName').value. Preferí editar su código un poco ahora que el siguiente código devuelve el resultado de la API.
async function getVersesforpage(pageNumber) {//to get verses for a certain pagetry try { const url = `https://api.alquran.cloud/v1/page/${pageNumber}/quran-uthmani`; const response = await fetch(url); const verses = await response.json(); return verses; } catch (e) { console.log("Error:", e.message) } } document.getElementById("form").addEventListener("submit", async (event) => { event.preventDefault(); const pageNumber = document.getElementById('number').value; const verses = await getVersesforpage(pageNumber); console.log(verses.data); });