js如果实现当前页面中已筛选参数高亮

Question

当前网址,例:http://www.shadoweb.cn/anli/?type=list&tag=asp&webok=2014
页面中筛选项列表:

 <div class="sl_list" id="sl_list">
<div class="selector">
<span>开发语言:</span>
<ul class="valueList">
<li><a href="/anli/?type=list&webok=2014">全部</a></li><li><a href="/anli/?type=list&webok=2014&tag=asp">ASP</a></li><li><a href="/anli/?type=list&webok=2014&tag=php">PHP</a></li><li><a href="/anli/?type=list&webok=2014&tag=jsp">JSP</a></li>
</ul>
</div>
<div class="selector">
<span>项目日期:</span>
<ul class="valueList">
<li><a href="/anli/?type=list&tag=asp">全部</a></li><li><a href="/anli/?type=list&tag=asp&webok=2016">2016</a></li><li><a href="/anli/?type=list&tag=asp&webok=2015">2015</a></li><li><a href="/anli/?type=list&tag=asp&webok=2014">2014</a></li>
</ul>
</div>
<div class="selector">
<span>网站类型:</span>
<ul class="valueList">
<li><a href="/anli/?type=list&tag=asp&webok=2014">全部</a></li><li><a href="/anli/?type=list&tag=asp&webok=2014&webname=公司">公司</a></li><li><a href="/anli/?type=list&tag=asp&webok=2014&webname=论坛">论坛</a></li><li><a href="/anli/?type=list&tag=asp&webok=2014&webname=官网">官网</a></li><li><a href="/anli/?type=list&tag=asp&webok=2014&webname=企业">企业</a></li>
</ul>

</div>
</div>

如何通过js实现列表中的a标签高亮.
即当前链接中 ?type=list&tag=asp&webok=2014
a标签中链接参数相同的高亮(只含&tag=asp&webok=2014这两个参数
同时,还需要注意webname参数值的中文转码...

请大神小手抖一抖,不胜感激.

我在网上找了一个,只是针对一个链接的,修改后实现不了.

 <script type="text/javascript">  

var myNav = document.getElementById("sl_list").getElementsByTagName("a");   
for(var i=0;i<myNav.length;i++)   
{   
   var links = myNav[i].getAttribute("href");   
   var myURL = "\/anli\/" + window.location.search;    
   if(myURL.indexOf(links) != -1)   
   {   
      myNav[i].className="sl_on";   
    }   
}  
document.write(myURL);  
</script>  

我的思路是得到当前URL中的参数,再匹配列表中的a标签中的URL的参数,参数和值完全相等的情况下,添加class.

不会写JS,麻烦了.

Answer 1

 <script type="text/javascript">
function GetQueryString(name,url)
{
     var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
     var r = url.substr(1).match(reg);
     if(r!=null)return  r[2]; return null;
}

var myNav = document.getElementById("sl_list").getElementsByTagName("a");   
for(var i=0;i<myNav.length;i++) 
{   
   var links = myNav[i].getAttribute("href").substring("6");
   var myURL =window.location.search;
//document.write(encodeURIComponent(GetQueryString("webname",links )));
var a=GetQueryString("classid",links );
var a1=GetQueryString("classid",myURL);
var b=GetQueryString("webyuyan",links );
var b1=GetQueryString("webyuyan",myURL);
var c=GetQueryString("webok",links );
var c1=GetQueryString("webok",myURL)
var d=GetQueryString("webname",links );
var d1=GetQueryString("webname",myURL);
var d2=encodeURIComponent(GetQueryString("webname",links ));
if(d!=null) { d=d2;}else{ d=d;}
if(a===a1 && b===b1 && c===c1 && d===d1 ) {myNav[i].className="sl_on"; }   
} 
//document.write(GetQueryString("webname",myURL)); 
</script>