js を使用して小さなプログラムの CSS を変更する方法

この小さなプログラムは、js を使用して CSS を変更します。まず、ページがスタイル変数を動的にバインドし、次にデータ オブジェクト内の変数を初期化し、ライフ サイクル関数の変数に値を割り当てます。最後に、左側のコードを使用して効果を確認します。

#この記事の動作環境: Windows 7 システム、WeChat アプレット開発ツール 2019 バージョン、Dell G3 コンピューター。

関連する無料の推奨事項: 小プログラム開発チュートリアル

js を使用して CSS を変更する方法小さなプログラム:

1. WeChat アプレット開発ツールを開き、新しい wxml ファイルを作成し、ビューとボタンを追加し、スタイルを設定し、フォント カラー変数をバインドします

2. 対応するページの js ファイルを開き、データ オブジェクトの変数 color を初期化します。

##3. ライフ サイクル関数 onLoad で、## を使用します#this.setData( {color:'#000'})

4. コードを保存して更新し、シミュレーターの対応するページ モジュールを確認します。左、ボタンのフォントの色が黒であることを確認します

#5. ページ コード スタイルで、font-size を追加し、変数 fontSize

# をバインドします。

##6. 次に、データ オブジェクトの変数 fontSize を初期化し、onLoad の fontSize に値を割り当てます。

#7. コードを再度保存します。左のシミュレータを確認すると、フォントサイズが大きくなっているのがわかります。

以上がjs を使用して小さなプログラムの CSS を変更する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。