JavaScript网站设计实践（二）实现导航栏当前所选页面的菜单项高亮显示

一、（一）中的代码还可以修改的地方。

在（一）中，如果是运行在服务器下，如apache等，可以把head和navigation的div抽取出来，放置在另一个html文件里，然后在页面中，include进来。这样，当要对导航栏进行修改时，只需要修改一个文件，而不用修改所有相关的页面文件。不过，我这里没有这样做，没有抽取出来。

二、实现当前页面的标识+不同页面的head头部背景图片的改变

现在在（一）实现的基础之上，来实现导航栏当前所选页面的菜单项高亮显示，让访问者一路了然知道“我正在这里”。

首先，修改color.css文件，给菜单项增加一个class="here"属性，也就是说等一下这个here是使用javascript动态增加的一个属性。现在先在控制颜色的color.css中设置here的样式声明。追加这个代码：

此时，你或者可以先尝试一下，给导航栏中的其中一个<a>标签添加一个class="here"的属性，可以看到该菜单项高亮显示。

然后，来创建一个global.js，存放所有页面会用到的js。

在《JavaScript DOM编程艺术》里面，前面几章给我们写了很多个可以使用的函数。现在把这几个有用的函数添加到global.js的文件里面来。

 添加高亮显示的函数