|
Сообщение от firsmember
|
А если в URL 1 запрос например
?y=2018
Тогда класс активной ссылки добавляется к ссылке
<li><a href="?y=2018&еще всякие запросы">2018</a></li>
и ко всем ссылкам месяцев
|
возможно вы хотели так ...)))
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.current-menu-item a{
color: red;
}
</style>
</head>
<body>
<ul class="news-nav-list">
<li><a href="?y=2022&еще всякие запросы">2022</a></li>
<li><a href="?y=2021&еще всякие запросы">2021</a></li>
<li><a href="?y=2018&еще всякие запросы">2018</a></li>
и т.д.
</ul>
<ul class="news-nav-list">
<li><a href="?всякие запросы&m=04">Апрель</a></li>
<li><a href="?всякие запросы&m=09">Сентябрь</a></li>
и т.д.
</ul>
<ul class="news-nav-list">
<li><a href="?всякие запросы&m=04">Апрель</a></li>
<li><a href="?всякие запросы&m=09&y=2018">тест</a></li>
и т.д.
</ul>
<script>
const params = new URLSearchParams("?y=2018"); //const params = new URLSearchParams(location.search);
document.querySelectorAll(".news-nav-list li").forEach(li => {
let link = li.querySelector("a");
let href = link.href;
let url = new URL(href);
let search = new URLSearchParams(url.search);
li.classList.remove("current-menu-item");
let add;
if(params.has("y") && params.has("m")) add = ["y","m"].every(key => search.has(key) && params.get(key) == search.get(key));
else if(params.has("m")) add = !search.has("y") && params.get("m") == search.get("m");
else if(params.has("y")) add = (!search.has("m") && params.get("y") == search.get("y")) || (search.has("m") && !search.has("y"));
if(add) li.classList.add("current-menu-item");
})
</script>
</body>
</html>