Имеются еще предложения?

Mytnyi,
возможно задачу нужно переформулировать, раз предложенные советы не подходят для решения вашей проблемы.

Да, скорее всего.

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

<a class="header_tabs_i __active" href="/" data-tab="nav-fz" style="text-decoration: none">
                        <div class="header_tabs_invert-radius __left">
                            <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" viewBox="0 0 10 10"><path class="cls-1" d="M615,13449a10.015,10.015,0,0,0,10-10v10H615Z" transform="translate(-615 -13439)"></path>
                            </svg>
                        </div>
                        <div class="header_tabs_invert-radius __right"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" viewBox="0 0 10 10"><path class="st0" d="M0,0c0,5.5,4.5,10,10,10H0V0z"></path></svg>
                        </div>
                        <span class="visible-lg-block visible-md-block">Физическим лицам</span> <span class="hidden-lg hidden-md">Физ. лицам</span>
                    </a>
                    <a class="header_tabs_i" href="/juridicheskim-licam" data-tab="nav-ur" style="text-decoration: none">
                        <div class="header_tabs_invert-radius __left"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" viewBox="0 0 10 10"><path class="cls-1" d="M615,13449a10.015,10.015,0,0,0,10-10v10H615Z" transform="translate(-615 -13439)"></path></svg>
                        </div>
                        <div class="header_tabs_invert-radius __right"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" viewBox="0 0 10 10"><path class="st0" d="M0,0c0,5.5,4.5,10,10,10H0V0z"></path></svg>
                        </div>
                        <span class="visible-lg-block visible-md-block">Юридическим лицам</span>
                        <span class="hidden-lg hidden-md">Юр. лицам</span>
                    </a>

У каждой из этих двух вкладок имеется разные:
href = /ссылка1/ , data-tab="nav-ur" и href = / ссылка2/ , data-tab="nav-fz".

Хочется сделать функцию что бы при клике на вкладку записывался определенный cookie, со значением data-tab и потом при дальнейшем переходе по этому клику этот cookie использовался для добавления класса вкладке.

Я хз как еще объяснить. Правда. Вроде алгоритм действий объяснил. Может я просто не владею такими способностями объяснять и это не моё. Тогда придется месяц колупаться.
Прошу знающих подключиться.

Зачем вам data-tab, если у ссылки есть href, который можно сравнить с текущим адресом страницы. А cookie обычно должен присылать сервер, а для хранения настроек используйте localStorage, который вам в этом примере не нужен, вам ведь не нужны проблемы с навигацией...

Ага. и потом крутить вертеть ключи как хочу. Правильно? Пошел курить...

Покурил.
Не получиться так. Не получиться сравнивать. Я же перехожу по другим ссылкам второго ряда.

URL – однозначно определяет ресурс, а то, что вы задумали — не обращать внимание на URL, приведёт к тому, что когда вы выберете «Частным лицам», а затем «Контакты», а затем «Юридическим лицам», а затем «Контакты», а затем в истории нажмёте переход на две страницы назад, то вы попадёте не в Частным лицам » Контакты, а в Юридическим лицам » Контакты, потому что cookie или localStorage.

А если поделиться такой ссылкой, то она не сможет узнать какую вкладку подсвечивать, посколько нет тех же cookie или localStorage.

А то, что я вам предлагаю, а именно — основываться на значении URL — хорошая практика, поскольку никаких неоднозначностей не возникает.

Вот смотри, перешёл в своём примере по Юридическим лицам » Контакты, скопировал адрес из адресной строки — https://charm-launch.glitch.me/h/юридическим-лицам/контакты, и ты видишь тот же самый раздел, а с cookie или localStorage так не получится (мы же не будем говорить о глобальных, всемирных cookie или localStorage, потому что для этого и есть URL)

Конечно тогда будет не оператор ===, а сравнение частей путей (например, при помощи метода startsWith у строки)

Malleys, я понял вас. вы мне в общем предлагаете сделать два разных хэдера. Об этом я думал еще в самом начале. Но так проще всего. Но только мне не нужно делиться ссылками. Даже если когда я выберу «Частным лицам», а затем «Контакты», а затем «Юридическим лицам», а затем «Контакты» и поделюсь этой ссылкой, то пусть другой юзер и заходит на «Частным лицам»-«Контакты».

Ладно попробую побиться в ворота рогами, просто теперь уже интересно как все таки использовать cokkie в нужном русле. Должен же я понимать эту тему) не получиться, сделаю со вторым хэдером.

Я такого не предлагал, я предлагал основываться на URL, в зависимости от его значения подсвечивается нужная вкладка и ссылка в одной и той же шапке сайта. Запомните — только один <header>! Интригующе, правда?

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

Я вам уже объяснял, почему вам такое не нужно!

Header [ˈhɛɾɚ] — это вам не «хэдер»!

Конечно!:blink:

По этому пути двигаться?


Буду по английски лучше писать, на будущее)