在活动菜单链接上添加类

Question

如果链接属于当前网址，我需要从菜单中更改链接的外观。我不知道如何检测当前的url并更改元素类。

我会使用jQuery

由于

Answer 1

$( document).ready(function (){
  $( function(){
    var url = window.location.pathname,
    urlRegExp = new RegExp(url.replace( /\/$/,'' ) + "$" );
    $('a').each( function(){
    if(urlRegExp.test(this .href.replace(/\/$/, ''))){
      $( this).addClass('active' );
    }
   });   
  });
});

Answer 2

你能做的是

1. 获取网址的位置
2. 使用.indexOf('.html')（或您的扩展程序）
3. 然后使用.substr(url.lastIndexOf('/'))（这将为您提供页面名称）
4. 然后将其与class选择器或id选择器
一起使用
5. 并在页面加载
上将active类触发到该链接

下面将会介绍：

让我们假设这是您的网址：http://localhost/myWebsite/index.html

 $(function(){ // this is done on doc ready function

    var url = window.location;
    var dUrl = url.substr(0, url.indexOf('.html'));
    var link = dUrl.substr(dUrl.lastIndexOf('/')+1);

    $('#'+link).addClass('active'); // on page load this will add the class to the corresponding link

 });

您可以尝试此演示：http://jsfiddle.net/K9YAz/

Answer 3

您可以使用window.location的属性来获取当前页面的URL或您需要的URL部分。然后，您可以选择菜单的每个锚点，循环它们，将它们各自的href属性的值与当前页面的URL进行比较。如果它们相等，则将适当的类添加到元素中。