How to use js to modify css in a small program

The small program uses js to modify css: first, the page dynamically binds the style variables; then initializes the variables in the data object; then assigns values ​​to the life cycle function variables; finally, save the code on the left side to view the effect.

The operating environment of this article: Windows 7 system, WeChat applet development tool 2019 version, Dell G3 computer.

Related free recommendations: 小program development tutorial

How to use js to modify css in a small program:

1. Open the WeChat applet development tool, create a new wxml file, add views and buttons, set styles and bind font color variables

2. Open the js file of the corresponding page and initialize the variable color in the data object

3. In the life cycle function onLoad, use this.setData( {color:'#000'})

4. Save the code and refresh, check the corresponding page module of the simulator on the left, and see that the button font color is black

5. In the page code style, add font-size and bind the variable fontSize

6. Then initialize the variable fontSize in the data object, and then assign a value to fontSize in onLoad

7. Save the code again and check the simulator on the left. You can see that the font size has become larger.

The above is the detailed content of How to use js to modify css in a small program. For more information, please follow other related articles on the PHP Chinese website!