[posso]

let data

async function getCountry(){
    let val = document.getElementById('country').value;
    const response = await fetch(`https://api.sampleapis.com/countries/countries?name=${val}`);

    let data1 = await response.json();
    let table = document.querySelector('#table');

    data1.forEach((data2)=>{

        table.innerHTML = '';
        let tr = document.createElement('tr');
        table.appendChild(tr);
       createCell(`<img src=${data2.media.flag} style = "width: 150px" alt="hello">`, tr);
        createCell(`${data2.capital}`, tr);
        createCell(`${data2.name}`, tr);
        createCell(`${data2.phone}`, tr);
    })






}

async function getapi(n) {
    const response = await fetch("https://api.sampleapis.com/countries/countries");
    data = await response.json();


    if(data){
        document.getElementById('spinner').style.display = 'none';
    }


    let notesOnPage = 20 + n;
    let countOfItems = Math.ceil(data.length / notesOnPage);

    let table = document.querySelector('#table');
    let pagination = document.querySelector('#pagination');



    let showPage = (function() {
        let active;

        return function(item) {
            if (active) {
                active.classList.remove('active');
            }
            active = item;

            item.classList.add('active');

            let pageNum = +item.innerHTML;

            let start = (pageNum - 1) * notesOnPage;
            let end = start + notesOnPage;

            let notes = data.slice(start, end);

            table.innerHTML = '';
            for (let note of notes) {
                let tr = document.createElement('tr');
                table.appendChild(tr);
                createCell(`<img src=${note.media.flag} style = "width: 150px" alt="hello">`, tr);
                createCell(note.capital, tr);
                createCell(note.name, tr);
                createCell(note.phone, tr);

            }
        };
    }());

    let items = [];
    for (let i = 1; i <= countOfItems; i++) {
        let li = document.createElement('li');
        li.innerHTML = i;
        pagination.appendChild(li);
        items.push(li);
    }

    showPage(items[0]);

    for (let item of items) {
        item.addEventListener('click', function() {
            showPage(this);
        });
    }

}

function createCell(text, tr) {
    let td = document.createElement('td');
    td.innerHTML = text;
    tr.appendChild(td);
}