Изменить значение переменной onclick

Question

Я новичок в JavaScript и мне нужна помощь. Я делаю сайт в оранжевых тонах, на сайте у меня есть две кнопки (а). и у меня есть два div, которые можно показать, нажав на кнопку. У меня есть еще три divs, окрашенные в красный, синий и оранжевый цвета, нажимая на них на странице меняются фон, заголовок, кнопки и divs в оттенки синего, красного или оранжевого. , когда я нажимаю кнопку (а) его цвет становится белым. , когда я нажимаю другую кнопку, он становится белым, а первый оранжевый оранжевый (это хорошо). , но если я перевернурую страницу в оттенки синего цвета, нажмите на первую кнопку, а затем , а на втором - на оранжевый, а не синий. Как я могу исправить это?

Я попытался сделать оператор if и переменную внутри функции. Когда я делаю это синим в функции, я написал var shades = "blue" (и то же самое для красного и оранжевого). затем в функции кнопки я написал цвет фона на белый, а затем поверните кнопку ather в оператор if (если оттенки = «синий» поверните фон на синий) , а затем другое утверждение (если оттенки = «красный», поворот фона на красный) и то же самое для оранжевого. , но это не сработало, потому что значение переменной изменилось только в функции и затем остановилось. Как я могу изменить значение переменных, нажав кнопку a?

спасибо.

Exemple:

<header> 
    <ul id="headerul"> 
     <li><a onclick="page1()" href="#" id="a" >page1</a></li> 
     <li><a onclick="page2()" href="#" id="a1">page2</a></li> 

     <div id="blue" onclick="colorB()"></div> 
     <div id="red" onclick="colorR()"></div> 
     <div id="orange" onclick="colorO()></div> 
    </ul> 
</header> 

<script> 
     function colorB(){ 
     document.getElementById('body').style.cssText = 
     'background-color:a7a7ff;' 
     document.getElementById('headerul').style.cssText = 
     'background-color:7777ff;' 
     document.getElementById('a').style.cssText = 
     'background-color:#a7a7ff;' 
     document.getElementById('a1').style.cssText = 
     'background-color:#a7a7ff;' 
     var body = 'blue' 
    } 
    function colorR(){ 
     document.getElementById('body').style.cssText = 
     'background-color:ff5252;' 
     document.getElementById('headerul').style.cssText = 
     'background-color:ff2222;' 
     document.getElementById('a').style.cssText = 
     'background-color:#ff5252;' 
     document.getElementById('a1').style.cssText = 
     'background-color:#ff5252;' 
     var body = 'red' 
    } 
    function colorO(){ 
     document.getElementById('body').style.cssText = 
     'background-color:#ffc5a0;' 
     document.getElementById('headerul').style.cssText = 
     'background-color:#ff8027;' 
     document.getElementById('a').style.cssText = 
     'background-color:#ffc5a0;' 
     document.getElementById('a1').style.cssText = 
     'background-color:#ffc5a0;' 
     var body = 'orange' 
    } 
    function page1(){ 
     document.getElementById('a1').style.cssText = 
     'background-color:white;' 
       if (body=="blue") { 
       document.getElementById('a').style.cssText = 
      'background-color:#a7a7ff;' 
     }; 
       if (body=="orange") { 
       document.getElementById('a').style.cssText = 
       'background-color:#ffc5a0;' 
     }; 
    } 
    function page2(){ 
     document.getElementById('a').style.cssText = 
     'background-color:white;' 
       if (body=="blue") { 
       document.getElementById('a1').style.cssText = 
      'background-color:#a7a7ff;' 
     }; 
       if (body=="orange") { 
       document.getElementById('a1').style.cssText = 
       'background-color:#ffc5a0;' 
     }; 
    } 
</script> 

Answer 1

Это почти невозможно, не видя ваш код, но на догадке это может помочь вам в некотором роде:

https://jsfiddle.net/1xv6qjpx/

I would add this as a comment but I don't yet have the ability to do so.