本文介绍了如何在微信小程序开发过程中，通过JavaScript实现为指定元素添加与移除CSS类的功能，并提供了具体的代码示例。
微信小程序实现点击添加移除class是一种常见的交互方式，在小程序开发中经常需要动态改变元素的样式以响应用户的操作。
第一步：在wxml文件中定义初始类名
我们需要在wxml文件中的视图标签上设置初始类名，以便后续通过JavaScript进行修改。示例如下：
```html
北京
上海
```
第二步：在wxss文件中定义样式
根据需要的视觉效果，在wxss文件中为不同的类名添加对应的CSS规则。示例如下：
```css
.location_bottom {
height: 140rpx;
line-height: 140rpx;
color: #d91f16;
font-size: 28rpx;
border-top: 2rpx solid #ebebeb;
border-bottom: 2rpx solid #ebebeb;
}
.add_city {
width: 228rpx;
height: 60rpx;
line-height: 60rpx;
text-align: center;
border: 2rpx solid #ebebeb;
color: #000000;
margin-right: 20rpx;
}
.add_citying {
width: 228rpx;
height: 60rpx;
line-height: 60rpx;
text-align: center;
border: 2rpx solid #09bb07;
color: #09bb07;
margin-right: 20rpx;
}
```
第三步：在js文件中处理点击事件
为了响应用户的点击操作，我们需要在页面的JavaScript部分定义一个函数来更新数据模型中的类名。示例如下：
```javascript
Page({
data: {
_num: 0,
},
clickNum: function (e) {
console.log(e.target.dataset.num);
this.setData({
_num: e.target.dataset.num
});
}
})
```
通过这三个步骤，我们可以实现点击按钮时动态添加或移除类名的效果，在微信小程序中创建丰富的交互体验。
5星
