使用 Javascript 单击时添加和删除类答案

【问题标题】：Add & Remove Class On Click with Javascript使用 Javascript 单击时添加和删除类
【发布时间】：2018-04-02 15:29:01
【问题描述】：

我其实不经常使用Javascript，也不太了解用它编码，所以我想原谅这个问题，如果它是一个简单的问题！

我有这个 html 元素：

<button class="btn"></button>

<div class="section1 active" style="z-index:1;"></div>

<div class="section2" style="z-index:2;"></div>

现在我想将“活动”类添加到 div .section2 中，同时通过单击按钮 .btn 将“活动”类从 div .section1 中删除。

此外，单击按钮 .btn 我想将样式属性“z-index:1”从 .section1 更改为“z-index:2”，同时更改“z-index:2” " 从 .section2 到 "z-index:1"

谁能给我一个完整的javascript代码，当我点击按钮时会改变类和样式属性？

谢谢你:)

【问题讨论】：

我相信您指的是 javascript 而不是 Java？
您需要 Javascript，而不是 Java。至于两者的区别，看这个：stackoverflow.com/a/245068/2391790
谢谢，我不知道有什么区别。我已将其更改为 javascript :)
“给我一个完整的 javascript 代码”....不.. Stackoverflow 不是免费的代码编写服务。这里的期望是你自己研究如何做这些事情。然后，当您的实际代码无法按预期工作时，您发布该代码，人们会帮助您

标签： javascript css

【解决方案1】：

$('.section1').click(function(){
	  $('.section1').removeClass('active').html('CLICK FOR ACTIVE').css('z-index', 1);
	  $(this).addClass('active').html('ACTIVE').css('z-index', 2);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<div class="section1 active" style="z-index:1;">CLICK FOR ACTIVE</div>

<div class="section1" style="z-index:2;">ACTIVE</div>

【讨论】：