Для того чтобы узнать, есть подключение к Интернету или нет можно использовать
navigator.onLine
alert(
navigator.onLine ? "Интернет подключен" : "Интернет не подключен"
);
Или же можно попытаться качать какой-нибудь ресурс, и если это удалось, то с подключением всё в порядке.
fetch("", { method: "HEAD" })
.then(() => true, () => false)
.then(onLine => alert(
onLine ? "Интернет подключен" : "Интернет не подключен"
)
);
Что же касается изменения подключения (проблемы со связью — сами отключили или кот, едете и перестало ловить и т. д.), то для этого есть события online и offline.
<html><body><script>
{
let checkConnection = event => {
let status = event.type;
document.body.style.backgroundColor = ({
"offline": "#ffdddd",
"online": "#ddffdd"
})[status];
};
addEventListener("online", checkConnection);
addEventListener("offline", checkConnection);
checkConnection(new Event(navigator.onLine ? "online" : "offline"));
};
</script></body></html>