高亮提示、聚焦控件并滚动到浏览器中刚刚好可以查看到该控件的位置

<style>
    /*高亮提示________________________*/
    [sg-high-light] { 
        animation: sg-high-light 1s ease 3;
    }
 
    @keyframes sg-high-light {
        0% {
            background: rgba(3, 156, 253, 0);
        }
        50% {
            background: rgba(3, 156, 253, 0.2);
        }
        100% {
            background: rgba(3, 156, 253, 0);
        }
    }
</style>
<script>
    /**聚焦焦点*/
    var focusDOM = {
        __hl(s) {
            s.setAttribute("sg-high-light", true);
            setTimeout(function () {
                s.removeAttribute("sg-high-light");
            }, 3000);
        },
        to(s, is) {
            typeof s == "string" && (s = document.querySelector(s));
            is ? (typeof is == "string" && (is = document.querySelector(is))) : (is = s);
            is.focus();
            ["input", "textarea"].includes(is.tagName.toLowerCase()) && is.select();
            s.scrollIntoView({behavior: "smooth", block: "nearest", inline: "nearest"});//缓慢滚动
            is.scrollIntoView({behavior: "smooth", block: "nearest", inline: "nearest"});//缓慢滚动
            this.__hl(s);
        }
    };
</script>