Активный начертание шрифта с JS + CSS - PullRequest
Новая
       4

Активный начертание шрифта с JS + CSS

0 голосов
/ 30 мая 2020

Мне нужно знать, как активировать font-weight на странице (я использую JavaScript).

Пример: если я нахожусь на странице учителей, <a> Teachers </a> font-weight должен быть жирным, как показано на изображении ниже.

enter image description here

<!DOCTYPE html>
<html>
   <head>

       {% block head %}
           <title>Private Classes</title>
       {% endblock %}

       <link rel="stylesheet" href="/styles.css">
   </head>

   <body>
       <header>       
           <div class="links">
               <a href="/" class="active">Teachers</a>
               <a href="/students">Students</a>
           </div>
       </header>       
       {% block content %}
       {% endblock %}

   </body>
</html>

Ответы [ 2 ]

1 голос
/ 30 мая 2020

Вы находитесь на странице учителей, а «активный» класс уже там, поэтому использовать javascript для него не нужно. Достаточно просто добавить толщину шрифта к «активному» классу. 

<style>
.active{
  font-weight: bold;
}
</style>
0 голосов
/ 31 мая 2020 
const currentPage = location.pathname
const menuItems = document.querySelectorAll("header .links a")

for (item of menuItems) {
    if (currentPage.includes(item.getAttribute("href"))) {
        item.classList.add("active")
    }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...