JS: одновременная установка свойства CSS и события «mouseover/mouseout»-2

JS: одновременная установка свойства CSS и события «mouseover/mouseout»

12345678

 document.querySelectorAll('.name a h1').forEach(el => {   
el.style .color = 'blue';   
 
el.addEventListener('mouseover', () => {   
el.style .color = 'red';  });   
el.addEventListener('mouseout', () => {   
el.style .color = 'yellow';  });   
});

Как правильно задать цвет: для текста или для ссылки?
Действие «mouseenter» на текст или вокруг ссылки?
Это вообще рабочий проект?

Результат работы: цикл работает, цвет устанавливается.
‘mouseover’, ‘mouseout’, – не работает.
Но если закоментить 2 строку, то цвет становится по установке из CSS.
И начинает работать одно событие: либо ‘mouseover’, либо ‘mouseout’.
Почему такое странное поведение ?
Или здесь нарушены принципы JS ?
Swiper3Dslider

все воспроизводится. Используйте DevTools , Overrides . В Overrides можно все смотреть, менять, тестировать. Относится к любому сайту. А то все хотят Codepen, в котором внешние файлы посмотреть нельзя.
(комменты разрешены !)

Как запустить эти несчастные события мыши ?

По дате

По рейтингу

pavel_10909

Просветленный

1г

Как правильно задать цвет: для текста или для ссылки?
Действие «mouseenter» на текст или вокруг ссылки?
Это вообще рабочий проект?

Всё стили/события прописываются только элементу. Указав свойство color для ссылки, меняется цвет текста внутри этой ссылки. Если вопрос про то задать ли свойство цвета элементу <a> или элементу <h1>, то это зависит от твоей цели. Если ни с чем не конфликтует, то можешь задавать стиль любому из этих элементов.
Повторяю - нельзя задать стили/события конкретно для текста. И что вообще значит "вокруг ссылки"?
Вообще не понятна в чём суть твоей претензии. Код работает.