效果截图:
HTML代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>网页title闪烁提示</title>
</head>
<body>
<button type="button" id="begin">开始</button>
<button type="button" id="end">结束</button>
</body>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/flashing.js"></script>
</html>
JS代码:
(function(window,$){
var interval;
var titleDefault;
flashing = {
beginChange: function(){
titleDefault = $("title").text();
let newTitle = "【新消息】" + titleDefault;
let oldTitle = "" + titleDefault;
let i = 0 ;
interval = setInterval(function(){
if(i == 0){
$("title").text(newTitle);
i = 1;
}else{
$("title").text(oldTitle);
i = 0;
}
},1000);
},
endChange: function(){
clearInterval(interval);
$("title").text(titleDefault);
},
}
$(function(){
$("#begin").on("click", flashing.beginChange);
$("#end").on("click", flashing.endChange);
})
})(window,$)
这个很实用