页面标题（title）闪动

最新推荐文章于 2023-02-03 20:00:16 发布

原创最新推荐文章于 2023-02-03 20:00:16 发布 · 1.5k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #ajax #title闪动 #标题闪动 #报警功能

js功能专栏收录该内容

0 篇文章

订阅专栏

本文介绍了一种利用JavaScript和Ajax实现网页标题闪动的方法，适用于需要定时扫描或报警的应用场景。通过设置计时器定期检查后台数据变化，并在满足特定条件下使浏览器标签页标题进行闪动提醒。

我们看到很多网站的顶部，有的需要标题一直闪动，有的是左右滚动，下面的代码则实现闪动问题。

可以解决定时扫描，报警之类的功能，比较简单

<script type="text/javascript" language="javascript">
    $(function () {
        CheckNews();
    });
    //定义计时器
    var mytimer;
    function CheckNews() {
        $.ajax({
            type: "get",
            //设置数据的一般处理程序的路径
            url: "warning/GetWarning.aspx",
            data: { op: "warn" },
            success: function (msg) {
                //如果返回的结果不等于“0”则表示已满足触发报警条件
                if (msg != "0") {
                    //闪动效果
                    flash_title();
                    //清空计时器，减轻服务器的压力
                    window.clearInterval(mytimer);
                }
            }
        });
    }

    //每隔20秒调用一次ajax方法，检查是否有满足报警条件的信息
    mytimer = setInterval("CheckNews()", 20000);

    //提示闪动
    var step = 0;
    function flash_title() {
        step++
        if (step == 3) { step = 1 }
        if (step == 1) { document.title = "[请尽快处理]有新的任务"; }
        if (step == 2) { document.title = "            有新的任务"; }
        setTimeout("flash_title()", 1000);
    }
</script>

这样我们就能在完成触发条件之后让页面标题一直闪动了