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

Question

[Erling]

Вопрос касается подсветить URL текущей страницы в навигации (не важно цветом или жирностью), чтобы не прописывать на каждый адрес отдельное правило.

Подскажите как это сделать? Правильно я понимаю что для этого нужно использовать window.document?
Как сделать чтобы в ссылке само определялось что ссылка на эту страницу == текущая страница?

Спасибо заранее!

Answer 1

[ThunderCat]

$('#navigation').find('a').each(function() {
    if(($(this).attr('href')==$(location).attr('href');) 
    || ($(this).attr('href')==$(location).attr('pathname');){
           $(this).parent.addClass("current");
    }
});

Возможно так...

UPD: jQuery нужен.

Comments

[Erling]

Отлично, спасибо. Я как раз в данную секунду писал что-то подобное. Благодарю.

[Erling]

ThunderCat вот так отлично сработало.

$('.nav-list').find(".nav-link").each(function(){
if($(this).attr("href") == $(location).attr("href")){
$(this).addClass("active");
}
});

Answer 2

[profesor08]

При генерации меню добавить активному пункту класс, а в CSS стилизовать пункт с таким классом.

<nav>
    <a href="1">home</a>
    <a href="1" class="active">files</a>
    <a href="1">about</a>
</nav>

nav a.active {
    font-weight: bold;
}

Ну, а распарсить урл и найти соответствующий пункт в меню, а потом его подсветить, на jаvascript всегда успеете.

Comments

[Erling]

Вопрос касается javascript. Прежде чем подставить класс надо определить что эта ссылка == адресу текущей страницы (где находишься в данный момент, чтобы ее подсветить).

[ThunderCat]

человек просил жс скрипт,находящий элемент, имеющий ссылку на текущую страницу и меняющий ее стиль.

[profesor08]

Я показал то, как это должно делаться. И указал, что надо делать с url страницы, если уж так хочется. И в тэгах указан не только javascript, но кое-что еще. И впредь, стройте вопросы точнее и указывайте правильные разделы, что не вводить в заблуждение ни себя, ни других.

Answer 3

[Stalker_RED]

Скорее window.location, а не document