普通的web開發(fā)可以通過JavaScript獲取HTML的Dom結(jié)構(gòu)，但是小程序不可以蒜哀，小程序?qū)崿F(xiàn)此功能的方式：數(shù)據(jù)綁定+data- 去更改標簽類名粪狼。
step 1 給選定的標志 {{}} & data-num
此處只綁定了一個類名电抚，也可以綁定N個類名。
class='class1 class2 {{num==1?"active":""}}'
<view class='oil_s' catchtap='changeOil'>
<view class='{{num==1?"active":""}}' data-num='1'>92#汽油</view>
<view class='{{num==2?"active":""}}' data-num='2'>95#汽油</view>
<view class='{{num==3?"active":""}}' data-num='3'>0#汽油</view>
</view>
綁定一個事件 可以給外面的塊綁定，也可以給每一個里邊的view綁定,如下：
<view class='oil_s' >
<view class='{{num==1?"active":""}}' data-num='1' catchtap='changeOil'>92#汽油</view>
<view class='{{num==2?"active":""}}' data-num='2' catchtap='changeOil'>95#汽油</view>
<view class='{{num==3?"active":""}}' data-num='3' catchtap='changeOil'>0#汽油</view>
</view>
唯一的區(qū)別是給事件傳入的 e 不同纤虽。
綁定在外面的塊的事件的e ,只有 target才會有dataset的值乳绕。
綁定給每一個小塊的事件的e ,不管是 target還是currentTarget都會有dataset的值。
e.target.dataset.num
step 2 寫好初始值
一開始選定哪一個逼纸，就給判斷的那個變量哪個值
data: {
num:1
},
step 3 寫好事件處理函數(shù)
changeOil:function(e){
console.log(e);
this.setData({
num:e.target.dataset.num
})
}
原理 是改變一下 用來判斷的那個變量 num 的值而已洋措。
他人的做法：
我用的類名active ,有的人會用cur ，【current的簡寫】
有人甚至總結(jié)出了三種方式：
1.通過修改類名 <view class="{{className}}"></view>
2.添加一個類名杰刽，覆蓋前面的樣式 <view class="helplist {{cur}}"></view>
3.修改行內(nèi)樣式菠发，覆蓋前面的樣式 <view class="helplist" style="{{currentStyle}}"></view>
第二種方式跟我的一樣，第三種方式最好不要使用贺嫂，畢竟我們要做一個性能佳的小程序滓鸠。
至此，完成第喳。
效果圖
