Почему при клике на навигацию не меняется id?

При клике на навигацию, сам по себе id элемента не должен изменяться. ID (идентификатор) - это уникальный атрибут HTML-элемента, который используется для идентификации этого элемента. ID должен быть уникальным для каждого элемента на странице и не должен меняться динамически.

Если вам нужно изменить состояние элемента при клике на него, вы можете использовать JavaScript для добавления или удаления классов, изменения текста или других свойств элемента. Вы можете назначить различные классы элементам и переключать между ними при клике на навигационные ссылки.

Пример на JavaScript, как можно изменить класс элемента при клике:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Change Class on Click</title>
<style>
.active {
    color: red;
}
</style>
</head>
<body>

<nav>
    <a href="#" id="link1" onclick="changeClass('link1')">Link 1</a>
    <a href="#" id="link2" onclick="changeClass('link2')">Link 2</a>
</nav>

<script>
function changeClass(id) {
    var element = document.getElementById(id);
    element.classList.toggle('active');
}
</script>

</body>
</html>

В этом примере при клике на ссылку с id "link1" или "link2" будет добавляться или удаляться класс "active" у этой ссылки, что позволит изменять ее стиль. Но сам id элемента остается неизменным.