html同步两个界面的数据

楼下做核酸经常拥堵,我试着做了一个程序,但有个地方卡住。就是这边我希望管理页面按了拥堵的按钮,然后在正常没有按钮的页面也可以同步拥堵的情况,不知道怎么实现!求解!在 线 等!求 求 啦!

html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>中海金玺公馆核酸检测实时拥堵情况管理界面title>
    head>
    <body>
        <h1>中海金玺公馆核酸检测实时拥堵情况  管理界面h1>
        <div class="box">div>
        <script>
            function getTime() {
                var date = new Date();
                var year = date.getFullYear(); //获取年份
                var month = date.getMonth() + 1; //获取月份
                var day = date.getDate(); //获取日期
                var hour = date.getHours(); //获取小时
                hour = hour < 10 ? '0' + hour : hour;
                var minute = date.getMinutes(); // 获取分
                minute = minute < 10 ? '0' + minute : minute;
                var seconds = date.getSeconds(); //获取秒
                seconds = seconds < 10 ? '0' + seconds : seconds;
                return year + '年' + month + '月' + day + '日 ' + hour + ':' + minute + ':' + seconds;
            }
            
            setInterval(function() {
                document.querySelector('.box').innerHTML = getTime();
            }, 1000)
        script>
        <h2>目前拥堵情况h2>
        <h3 id="claa">通畅h3>
        <button id="clab" type="button" onclick="myFunction()">
            拥堵
        button>
        <button id="clac" type="button" onclick="myFunctio()">
            通畅
        button>
                
    body>
    <script>
        function myFunction() {
            x = document.getElementById("claa");
            x.innerHTML = "拥堵";
            y = document.getElementById("clab")
            y.innerHTML = "拥堵"
        }
    script>
    <script>
        function myFunctio(){
            x = document.getElementById("claa");
            x.innerHTML = "通畅";
            z = document.getElementById("clac")
            z.innerHTML = "通畅"
        }
    script>
html>

WebSocket

这个可以 借用接口了吧