Javascript 我希望我的按钮在特定元素的两种样式之间切换，例如单击h1，但按钮只是消失_Javascript_Html_Jquery_Css

Javascript 我希望我的按钮在特定元素的两种样式之间切换，例如单击h1，但按钮只是消失

javascript html jquery css

Javascript 我希望我的按钮在特定元素的两种样式之间切换，例如单击h1，但按钮只是消失,javascript,html,jquery,css,Javascript,Html,Jquery,Css,//这是html文档的主体。我想让我的按钮改变h1的样式，比如每当点击按钮时在黄色和紫色之间切换。我尝试在按钮上使用切换功能，但每当我重新加载页面时，按钮就会在转换过程中消失 <body> <h1>Hello</h1> <button>Click Me</button> <button>Click Me</button> <button

//这是html文档的主体。我想让我的按钮改变h1的样式，比如每当点击按钮时在黄色和紫色之间切换。我尝试在按钮上使用切换功能，但每当我重新加载页面时，按钮就会在转换过程中消失

    <body>
        <h1>Hello</h1>
        <button>Click Me</button>
        <button>Click Me</button>
        <button>Click Me</button>
        <button>Click Me</button>
        <button>Click Me</button>

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
        <script src="index.js" charset="utf-8"></script>
      </body>


    //this is the js code. the buttons simply disappear when I reload the page

    $("button").toggle(function() {
        /* Stuff to do every *odd* time the element is clicked */
        $("h1").css("color","purple");
      }, function() {
        /* Stuff to do every *even* time the element is clicked */
        $("h1").css("color","yellow");
      });


你好
点击我
点击我
点击我
点击我
点击我
//这是js代码。当我重新加载页面时，按钮就消失了
$（“按钮”）.toggle（函数（）{
/*每次单击元素*奇数*时要执行的操作*/
$（“h1”）.css（“颜色”、“紫色”）；
}，函数（）{
/*每次*甚至*单击元素时要执行的操作*/
$（“h1”）.css（“颜色”、“黄色”）；
});

toggle（）方法在选定元素的hide（）和show（）之间切换。因此，您所做的是在加载时有效地隐藏按钮。您需要将脚本更改为类似这样的内容

   <script>
      let flag=true;
      $("button").click(function() {
          /* Stuff to do every *odd* time the element is clicked */
          flag ? $("h1").css("color","purple"): $("h1").css("color","yellow");
          flag=!flag;
        });
    </script>


让flag=true；
$（“按钮”）。单击（函数（）{
/*每次单击元素*奇数*时要执行的操作*/
flag？$（“h1”）.css（“颜色”、“紫色”）：$（“h1”）.css（“颜色”、“黄色”）；
flag=！flag；
});

或者你可以尝试切换类。定义两个类：紫色和黄色。在节点中应用紫色作为

<h1 class="purple">Hello</h1>

你好然后用脚本

<script>
      $("button").click(function(){
      $("h1").toggleClass('yellow');
});
</script>


$（“按钮”）。单击（函数（）{
$（“h1”）.toggleClass（“黄色”）；
});

这也会起作用