如何更改网站标题
作为一个标准的HTML文档,网页标题(title)是必不可少的属性。随着浏览器的发展,我们又多了一种访问和修改文档的方式:DOM。所以我们获取网页标题的方式大致可分为以下两种:
1。通过document对象访问title
var title = document。 title;
2。通过DOM方式访问title
var title = tElementsByTagName('title')[0];
但是这两种获取方式是截然不同的,document。title这种方式可以直接获得网页标题的字符串副本,它返回一个字符串;然而通过DOM方式获取的则是HTML文档中的title结点对象。
...全部
作为一个标准的HTML文档,网页标题(title)是必不可少的属性。随着浏览器的发展,我们又多了一种访问和修改文档的方式:DOM。所以我们获取网页标题的方式大致可分为以下两种:
1。通过document对象访问title
var title = document。
title;
2。通过DOM方式访问title
var title = tElementsByTagName('title')[0];
但是这两种获取方式是截然不同的,document。title这种方式可以直接获得网页标题的字符串副本,它返回一个字符串;然而通过DOM方式获取的则是HTML文档中的title结点对象。
•var TOSTRING = String;
alert( ll( tElementsByTagName('title')[0]));// output [object Object]
alert( ll(document。
title)); // output [object String]
我们可以利用结点对象的innerHTML属性输出网页标题:
tElementsByTagName('title')[0]。
innerHTML;
修改网页标题
此处我们讨论IE浏览器在实现时的一个小Bug:我们知道,理论上可以通过DOM修改HTML文档中的任何一个节点,按照这句话,我们当然可以修改HTML文档中的title节点了。
但有趣的是,IE浏览器在这个地方实现的比较怪异,具体为:
•IE中不能通过 tElementsByTagName('title')[0]。innerHTML来修改title节点内部的子节点,任何试图通过DOM修改网页标题的方法在IE下都将会引发“未知的运行时错误”的异常
•IE视title节点下不存在任何子节点,即其子节点长度为0,即
tElementsByTagName('title')[0]。
childNodes。length; // output 0
但是其innerHTML属性却能正确地返回网页的标题内容
Firefox在此处表现非常完美。不过除FF和IE,其他的浏览器我没有测试过,感兴趣的朋友可以尝试着去试试。
(估计都会比IE表现的要好^^)
有句话说的好,老方法不一定就过时,存在多年的document。title在这时凸显了它的优势,因为这个属性既能获取网页标题也能修改标题,同时HTML文档中的title节点也会同步地更新。
所以:
•document。title = "new title";
alert( tElementsByTagName("title")[0]。innerHTML == "new title");// output true
目前对于IE浏览器而言,唯一修改网页标题的方式就是使用document。
title这种古老而不过时的方法。同时,这种方法对于其他浏览器也同样适用。
结论
在web开发中,若要处理网页标题的问题,需要注意一下几点:
•在现实世界中利用document。
title来处理所有关于获取和修改网页标题的需求,以实现跨浏览器
•当网页中有定义多个title元素时(当然这是错误的做法,但浏览器并不会报错),无论哪种使用哪种方法获取网页标题,只有按照DOM文档结构或是文档流的顺序查找所遇到的第一个title元素是有效的标题
•IE错误地认为title节点下无任何子节点,而利用innerHTML属性却可以正确获取文档标题
•对于IE浏览器,无法通过DOM方式去修改文档标题,任何试图通过DOM修改网页标题的方法在IE下都将会引发“未知的运行时错误”的异常
最佳实践
获取文档标题:var title = document。
title;
修改文档标题:document。title = "new title";。收起