Einige Webmaster bemerken diesen Effekt möglicherweise. Wenn wir einige SNS-Social-Networking- und Community-Foren durchsuchen, sehen wir oft, dass die Titelaufforderungen neuer Nachrichten blinken. Wie können wir diesen Effekt also auf Ihre eigene Website anwenden? Welchen Effekt hat das Blinken neuer Nachrichten im Seitentitel? Der Herausgeber hatte das Glück, solchen Code auf einem bestimmten großartigen Technologie-Blog zu sehen, der auf dem JQuery-Framework basiert.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'test.jsp' starting page</title>
</head>
<body>
<p style="text-align: center;">
请看网页标题处效果！
<br />
隔10秒后提示消失
</p>
<script type="text/javascript"
src="script/jquery-2.0.3.js">
</script>
<script type="text/javascript">
(function($) {
$.extend( {
/**
* 调用方法： var timerArr = $.blinkTitle.show();
* $.blinkTitle.clear(timerArr);
*/
blinkTitle : {
show : function() { //有新消息时在title处闪烁提示
var step = 0, _title = document.title;
var timer = setInterval(function() {
step++;
if (step == 3) {
step = 1
}
if (step == 1) {
document.title = '【 】' + _title
}
if (step == 2) {
document.title = '【新消息】' + _title
}
}, 500);
return [ timer, _title ];
},
/**
* @param timerArr[0], timer标记
* @param timerArr[1], 初始的title文本内容
*/
clear : function(timerArr) { //去除闪烁提示，恢复初始title文本
if (timerArr) {
clearInterval(timerArr[0]);
document.title = timerArr[1];
}
}
}
});
})(jQuery);
jQuery(function($) {
var timerArr = $.blinkTitle.show();
setTimeout(function() { //此处是过一定时间后自动消失
$.blinkTitle.clear(timerArr);
}, 10000);
//若认为操作消失，只需如此调用： $.blinkTitle.clear(timerArr);
});
</script>
<br />
</body>
</html>
Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er gefällt Ihnen allen.
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
