/**
* @preserve W Zhang * For weixuanz.github.io */
const loadBtn = document.querySelector('#loadmore-btn') loadBtn.addEventListener('click', loadNextPage)
function loadNextPage() {
const postList = document.querySelector('#blog-list') const currentPage = +postList.getAttribute('data-page') const totalPages = +postList.getAttribute('data-totalPages') const setBusy = () => { loadBtn.textContent = 'Loading...' loadBtn.disabled = true } const setInitial = () => { loadBtn.textContent = 'Load more...' loadBtn.disabled = false } if (currentPage === totalPages) { return } setBusy() const opts = { method: 'GET', headers: {} } fetch(`/page${currentPage + 1}`, opts) .then((response) => response.text()) .then((html) => { const parser = new DOMParser() const doc = parser.parseFromString(html, 'text/html') doc .querySelectorAll('#blog-list a') .forEach((el) => postList.appendChild(el)) setInitial() postList.setAttribute('data-page', currentPage + 1) if (currentPage + 1 === totalPages) { loadBtn.onclick = null loadBtn.remove() } })
}