普通的web開發可以通過JavaScript獲取HTML的Dom結構，但是小程式不可以，小程式實現此功能的方式：資料繫結+data- 去更改標籤類名。

step 1 給選定的標誌 {{}} & data-num

此處只綁定了一個類名，也可以繫結N個類名。

1. class='class1 class2 {{num==1?"active":""}}'
2. <view class='oil_s' catchtap='changeOil'>
3. <view class='{{num==1?"active":""}}' data-num='1'>92#汽油</view>
4. <view
   class='{{num==2?"active":""}}' data-num='2'>95#汽油</view>
5. <view class='{{num==3?"active":""}}' data-num='3'>0#汽油</view>

繫結一個事件 可以給外面的塊繫結，也可以給每一個裡邊的view繫結,如下：

1. <viewclass='oil_s'>
2. <viewclass='{{num==1?"active":""}}'data-num='1'catchtap='changeOil'>92#汽油</view>
3. <viewclass
   ='{{num==2?"active":""}}'data-num='2'catchtap='changeOil'>95#汽油</view>
4. <viewclass='{{num==3?"active":""}}'data-num='3'catchtap='changeOil'>0#汽油</view>
5. </view>

唯一的區別是給事件傳入的 e 不同。 
繫結在外面的塊的事件的e ,只有 target才會有dataset的值。 
繫結給每一個小塊的事件的e ,不管是 target還是currentTarget都會有dataset的值。 

e.target.dataset.num 
step 2 寫好初始值

一開始選定哪一個，就給判斷的那個變數哪個值

1. data:{
2. num:1
3. },

step 3 寫好事件處理函式

1. changeOil:function(e){
2. console.log(e);
3. this.setData({
4. num:e.target.dataset.num
5. })
6. }

原理 是改變一下 用來判斷的那個變數 num 的值而已。

他人的做法：

我用的類名active ,有的人會用cur ，【current的簡寫】 
有人甚至總結出了三種方式：

1. 1.通過修改類名<view class="{{className}}"></view>
2. 2.新增一個類名，覆蓋前面的樣式<view class="helplist {{cur}}"></view>
3. 3.修改行內樣式，覆蓋前面的樣式<view class="helplist" style="{{currentStyle}}"></view>

第二種方式跟我的一樣，第三種方式最好不要使用，畢竟我們要做一個性能佳的小程式。 
至此，完成。 

效果圖