let currentPage = 0;
const pages = document.querySelectorAll('.page');

setInterval(() => {
     pages[currentPage].style.display = 'none';
     currentPage = (currentPage + 1) % pages.length;
     pages[currentPage].style.display = 'block';
    }, 1000);

#slider {
    width: 100%;
    height: 300px;
    overflow: hidden;
}

.page {
    width: 100%;
    height: 300px;
    text-align: center;
}

.page:not(:first-child) {
    display: none;
}

<div id="slider">
    <div class="page"><img src="img1.hscicdn.com/image/upload/f_auto/lsci/db/PICTURES/CMS/…></div>
    <div class="page">Image2</div>
    <div class="page">Image3</div>
</div>