Как подсветить в навигации ссылку на активную страницу?

Question

[K G]

Доброго времени суток.
Есть на странице в header навигация с классом .main-nav в ней лежат ul>li>a, все как обычно.
Есть такой скрипт, который отслеживает активную страницу и выделяет пункт меню черным.

onload = function ()
{
for (var lnk = document.links, j = 0; j < lnk.length; j++)
if (lnk [j].href == document.URL) lnk [j].style.cssText = 'color:rgb(0,0,0)';
}

Но точно такая же навигация есть и в footer. Так вот, как дописать скрипт, чтобы он выделял пункт навигации активной страницы только в header.

Спасибо

Answer 1

[Денис Инешин]

Это неправильное проектирование. Задачу навешивания активного класса на ссылку должен делать сервер.

Comments

[Pavel]

отнюдь) .. смотря какое приложение, например какое нибудь spa (gmail), meteor app и т.д. то там совсем не сервер "навешивает активные классы"

[Денис Инешин]

Pavel: Вы на код посмотрите, тут нет следов SPA приложений. У который кстати такой вопрос вообще не стоит, так как всю работу делает роутер или его аналог.

Answer 2

[Юрий Гринёв]

Не знаю, поможет или нет, но я юзаю такой кастыль:

$(function(){
		var url  = location.pathname,
			page = url.split("/")[1];
		$('ul li a[href="/'+page+'"]').parent().addClass('active');
		console.log('Страница: '+page);
	});

Comments

[Юрий Гринёв]

В вашем случае можно просто дописать header в начало ul li a[href="/'+page+'"]