快捷導(dǎo)航

微信小程序 JS動態(tài)修改樣式的實現(xiàn)代碼

更新時間：2017年02月10日 13:48:06 作者：huangenai

這篇文章主要介紹了微信小程序 JS動態(tài)修改樣式的實現(xiàn)代碼,原理是綁定數(shù)據(jù)，然后動態(tài)的修改數(shù)據(jù)，從而實現(xiàn)動態(tài)樣式的改變而已,需要的朋友可以參考下

微信小程序這個坑啊，js動態(tài)修改樣式，我們并不能用js或者jq 輕輕松松一行代碼搞定?；蛘哂胷emoveClass addClass 來修改樣式。

以下是一種動態(tài)修改樣式的方法，原理是綁定數(shù)據(jù)，然后動態(tài)的修改數(shù)據(jù)，從而實現(xiàn)動態(tài)樣式的改變而已。感覺有點········那個啥的，怪怪的。不過也沒辦法了。如果你有更好的方法，可以在評論區(qū)分享一下。

test.wxml

<view style="text-align: center;">
 <label style="color:{{color}};">我會變色</label>
 <button bindtap="clickRed">變紅</button>
 <button bindtap="clickgreen">變綠</button>
</view>

test.js

Page({
 data: {
 color: "red"
 },
 clickRed: function () {
 this.setData({
  color: "red"
 })
 },
 clickgreen: function () {
 this.setData({
  color: "green"
 })
 }
})

效果

以上所述是小編給大家介紹的微信小程序 JS動態(tài)修改樣式的實現(xiàn)代碼，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

相關(guān)文章

javascript實現(xiàn)二分查找法實現(xiàn)代碼
javascript實現(xiàn)二分查找法實現(xiàn)代碼...
2007-11-11
js實現(xiàn)高精度加減乘除模板的示例代碼
這篇文章給大家介紹了如何使用js實現(xiàn)高精度加減乘除模板,文章通過代碼示例介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作有一定的幫助,感興趣的小伙伴可以自己動手嘗試一下
2023-10-10
淺談JS三座大山之異步和單線程
首先我們要知道，js這門語言是單線程的，同時只能做一件事，比如說渲染dom，執(zhí)行js方法，這些事情只能一個一個做，不能分開執(zhí)行。（因為js需要操作dom，當(dāng)兩個js方法同時操作一個dom的時候就會出問題，所以js被設(shè)計成了單線程）。本文將介紹JS三座大山之異步和單線程。
2021-06-06
前端js中的事件循環(huán)eventloop機(jī)制詳解
這篇文章主要給大家介紹了關(guān)于前端js中事件循環(huán)eventloop機(jī)制的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家學(xué)習(xí)或者使用js具有一定的參考學(xué)習(xí)價值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧
2019-05-05
javascript 循環(huán)調(diào)用示例介紹
循環(huán)調(diào)用,如果已經(jīng)獲取到了結(jié)果,則退出循環(huán)，下面有個不錯的示例，感興趣的朋友可以嘗試操作下
2013-11-11
JavaScript 正則表達(dá)式詳解
正則表達(dá)式(Regular Expression)是一門簡單語言的語法規(guī)范，是強(qiáng)大、便捷、高效的文本處理工具，它應(yīng)用在一些方法中，對字符串中的信息實現(xiàn)查找、替換和提取操作
2021-11-11
JS擴(kuò)展類，克隆對象與混合類實例分析
這篇文章主要介紹了JS擴(kuò)展類，克隆對象與混合類,通過自定義extend,clone與augment函數(shù)實例分析了類的擴(kuò)展，對象的克隆與混合類相關(guān)實現(xiàn)與使用技巧,需要的朋友可以參考下
2016-11-11
JS同源策略和跨域問題深入分析和解決
這篇文章主要介紹了JS同源策略和跨域問題深入分析和解決,在Web開發(fā)中,跨域問題是一個常見且必須解決的難題,當(dāng)瀏覽器出于安全考慮限制不同源之間的資源交互時,開發(fā)者需要掌握多種方案來繞過這些限制,需要的朋友可以參考下
2025-02-02
JS字符串常用操作方法實例小結(jié)
這篇文章主要介紹了JS字符串常用操作方法,結(jié)合實例形式總結(jié)分析了javascript字符串獲取、返回、拼接、替換、搜索、計算等相關(guān)操作技巧,需要的朋友可以參考下
2019-06-06
以JavaScript來實現(xiàn)WordPress中的二級導(dǎo)航菜單的方法
這篇文章主要介紹了以JavaScript來實現(xiàn)WordPress中的二級導(dǎo)航菜單的方法,文中首先對WordPress基本的PHP導(dǎo)航菜單的做法給出了說明來作為基礎(chǔ),需要的朋友可以參考下
2015-12-12