利用js跨页面保存变量做菜单的方法

最近公司在做一个项目，其中一块头部的菜单导航区，要求实现进入相关页面后上面的导航菜单图片也需变换．而这个对于静态页面或者用框架或iframe的来说是很容易实现的．而我们是利用include来包含进的这个top.asp．虽然可以在那个图片菜单上定义onclick的动作属性．但是只要一跳转页面，则这个onclick动作就没用了．因为top.asp被重新加载了．如果要解决这个问题，只能是在页面加载时能读取一个全局的变量，相对于浏览器的全局变量，通过这个变量的值来判断应该如何显示这个导航菜单．于是也便有了本文．

我想到的解决方法有两种：

１．利用cookies或session，在每个页面加载时写一个cookies或session变量，这个看似能很好的解决问题．但是却出现了一个问题．那就是如果用户禁止了cookies，则这个效果将无法实现，永远只是显示默认效果．所以我放弃这种做法

２．利用history或navigator来建立这么一个相对于浏览器的变量．只要我浏览器没关，则这个变量就会持续存在．这样就达到了我们想要的效果．我也是用这种方法来解决的．下面是具体实现部分．

<script type="text/JavaScript">
<!--
 function foc(){
 document.getElementById("searchkey").focus();
 }   //这是做搜索时一个函数与本文无关

 function init(){  //初始化函数
  if (history.dmenu){}else
  {
   history.dmenu=1;
  }

//如果history.dmenu没有定义则设置为１即显示首页按扭的效果
  switch(history.dmenu){
   case 1:
    {
    //alert(history.dmenu);
    document.getElementById("d_id1").src="https://www.jb51.net/images/anB1.gif";
    document.getElementById("d_id2").src="https://www.jb51.net/images/anB2.gif";
    document.getElementById("d_id3").src="https://www.jb51.net/images/anB3.gif";
    document.getElementById("d_id4").src="https://www.jb51.net/images/anB4.gif";
    document.getElementById("d_id5").src="https://www.jb51.net/images/anB5.gif";
    document.getElementById("d_id6").src="https://www.jb51.net/images/anB6.gif";
    break;}
    case 2:
    {
    //alert(history.dmenu);
    document.getElementById("d_id1").src="/images/anB11.gif";
    document.getElementById("d_id2").src="/images/anB22.gif";
    document.getElementById("d_id3").src="https://www.jb51.net/images/anB3.gif";
    document.getElementById("d_id4").src="https://www.jb51.net/images/anB4.gif";
    document.getElementById("d_id5").src="https://www.jb51.net/images/anB5.gif";
    document.getElementById("d_id6").src="https://www.jb51.net/images/anB6.gif";
    break;
    }
    case 3:
    {
    document.getElementById("d_id1").src="/images/anB11.gif";
    document.getElementById("d_id2").src="https://www.jb51.net/images/anB2.gif";
    document.getElementById("d_id3").src="/images/anB33.gif";
    document.getElementById("d_id4").src="https://www.jb51.net/images/anB4.gif";
    document.getElementById("d_id5").src="https://www.jb51.net/images/anB5.gif";
    document.getElementById("d_id6").src="https://www.jb51.net/images/anB6.gif";
    break;
    }
    case 4:
    {
    document.getElementById("d_id1").src="/images/anB11.gif";
    document.getElementById("d_id2").src="https://www.jb51.net/images/anB2.gif";
    document.getElementById("d_id3").src="https://www.jb51.net/images/anB3.gif";
    document.getElementById("d_id4").src="/images/anB44.gif";
    document.getElementById("d_id5").src="https://www.jb51.net/images/anB5.gif";
    document.getElementById("d_id6").src="https://www.jb51.net/images/anB6.gif";
    break;
    }
    case 5:
    {
    document.getElementById("d_id1").src="/images/anB11.gif";
    document.getElementById("d_id2").src="https://www.jb51.net/images/anB2.gif";
    document.getElementById("d_id3").src="https://www.jb51.net/images/anB3.gif";
    document.getElementById("d_id4").src="https://www.jb51.net/images/anB4.gif";
    document.getElementById("d_id5").src="/images/anB55.gif";
    document.getElementById("d_id6").src="https://www.jb51.net/images/anB6.gif";
    break;
    }
    case 6:
    {
    document.getElementById("d_id1").src="/images/anB11.gif";
    document.getElementById("d_id2").src="https://www.jb51.net/images/anB2.gif";
    document.getElementById("d_id3").src="https://www.jb51.net/images/anB3.gif";
    document.getElementById("d_id4").src="https://www.jb51.net/images/anB4.gif";
    document.getElementById("d_id5").src="https://www.jb51.net/images/anB5.gif";
    document.getElementById("d_id6").src="/images/anB66.gif";
    break;
    }
  }
 }
 //上面是具体的判断那个变量然后据变量的值来进行图片的变换从而达到我们要的效果．

 function menushow(d_id){