如何写一个网页标题title的闪动提示(转)

通过网页title来提示用户有新消息这个功能很常见，比如现在的微博，还有一些邮箱，这个功能都很常见。如何实现则个功能呢？

思路是：通过ajax访问后台，若有新消息，则将网页的title替换为 提示信息 ，并与空格来回切换。例：【你有新消息】与【　　　　　】切换。提示内容弄是动态的，所以替换文字的空格数目也是算出的。这里用全角的空格。但是如果提示 消息中有‘数字’等半角字符的话就会出现问题。全角的空格比半角的1的宽度要宽的多。这样的话，闪动起来看着就不是很舒服；解决方法就是用全角的空格替换 全角的字符，半角的空格替换半角的字符。

但是document.title=' ';不论半角空格有多少个，浏览器只显示一个。用 的话，它原样输出；只能用var t=document.getElementsByTagName('title')[0]。获取title dom对象，通过 t.innerHTML=' '来修改。

效果演示

显示信息数：

但会这么顺利么，当然不会。我们可爱的ie在这个时候总会出来捣乱。在ie浏览器下title的innerHTML是只读的（不光是 title，其它的如：COL, COLGROUP, FRAMESET, HTML, STYLE, TABLE, TBODY, TFOOT, THEAD, TR的innerHTML属性是只读的）。如果强制赋值的话会出现“未知的运行时错误”。目前我也没有找到很到的办法，只能加上 try{}catch(e){}对它进行特殊处理了

分享下源代码：

01	<script type="text/javascript" language="javascript">

02	var flashTitlePlayer = {

03	start: function (msg) {

04	this.title = document.title;

05	if (!this.action) {

06

try {

07	this.element = document.getElementsByTagName('title')[0];

08	this.element.innerHTML = this.title;

09	this.action = function (ttl) {

10	this.element.innerHTML = ttl;

11

};

12	} catch (e) {

13	this.action = function (ttl) {

14	document.title = ttl;

15

}

16	delete this.element;

17

}

18	this.toggleTitle = function () {

19	this.action('【' + this.messages[this.index = this.index == 0 ? 1 : 0] + '】欢迎访问简明现代魔法');

20

};

21

}

22	this.messages = [msg];

23	var n = msg.length;

24	var s = '';

25	if (this.element) {

26	var num = msg.match(/\w/g);

27	if (num != null) {

28	var n2 = num.length;

29

n -= n2;

30	while (n2 > 0) {

31

s += " ";

32

n2--;

33

}

34

}

35

}

36	while (n > 0) {

37

s += '　';

38

n--;

39

};

40	this.messages.push(s);

41	this.index = 0;

42	this.timer = setInterval(function () {

43	flashTitlePlayer.toggleTitle();

44

}, 1000);

45

},

46	stop: function () {

47	if (this.timer) {

48	clearInterval(this.timer);

49	this.action(this.title);

50	delete this.timer;

51	delete this.messages;

52

}

53

}

54

};

55	function flashTitle(msg) {

56	flashTitlePlayer.start(msg);

57

}

58	function stopFlash() {

59	flashTitlePlayer.stop();

60

}

61

</script>

火狐，chrome下没问题，ie当提示消息中有一个或没有半角字符时没问题。