我希望我的按钮在特定元素的2种样式之间进行切换，例如单击h1时，按钮会消失

//这是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=".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");
      });
回答如下：

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>

或者您可以尝试toggleClass。定义两个类别，例如紫色和黄色。在节点上应用紫色，例如

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

然后使用脚本

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

这也将起作用

我希望我的按钮在特定元素的2种样式之间进行切换，例如单击h1时，按钮会消失

//这是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=".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");
      });
回答如下：

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>

或者您可以尝试toggleClass。定义两个类别，例如紫色和黄色。在节点上应用紫色，例如

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

然后使用脚本

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

这也将起作用