Как изменить css ссылки если она ведет сама на себя?

Question

Есть ли какое-то простое решение например в виде скрипта? Нужно изменить стиль кнопки, если ее ссылка ведет сама на себя.

Например, менять цвет кнопки активного товара на сайте:

Answer 1

// получаем необходимый элемент
let elem = document.querySelector(selector)
// проверяем выполняется ли необходимое нам условие
if (elem.getAttribute('href') == elem.textContent) {
    // если условие выполняется, то вешаем на этот элемент необходимый класс
    elem.classList.add('other_color')
}

В css добавляем необходимые стили для класса other_color

Upd: пояснение: Этот кусок кода добавляет класс other_color на выбранный элемент, если атрибут href соответствует текстовому содержанию элемента

Answer 2

function end(url){
    return url.substring(url.lastIndexOf('/')+1)
}

[...document.querySelectorAll("a")].filter(el=>(
    end(el.href) === end(document.location.href)
)).forEach(el=>{
    el.classList.add('current')
})

end в примере сравнивает по "имени файла". Как нужно в конкретном случае -- трудно сказать. Разные ссылки могут вести в одно место.

[...document.querySelectorAll("a")].filter(el => el.href === document.location.pathname).forEach(el=>{
    el.classList.add('current')
})

БЛОГ НА HUSL

Как изменить css ссылки если она ведет сама на себя?

Ответы (2 шт):