How to change the height of an element in jquery

Jquery method to change the height of an element: 1. Create a new HTML file; 2. Create a module using the div tag; 3. Use css to set the style of the div through the id; 4. Create a button; 5. Create the addheight() function in the js tag; 6. Use height() to set the div height.

The operating environment of this article: windows7 system, jquery version 3.2.1, DELL G3 computer

How does jquery change the height of an element?

Use jquery to dynamically change the height of a div:

Create a new html file, named test.html, to explain how to use jquery to dynamically change the height of a div.

In the test.html file, use the div tag to create a module and set its id to mytest.

In the css tag, use css to set the style of the div through the id, define the height of the div as 100px, the width as 100px, and the background color as yellow.

In the test.html file, use the button tag to create a button with the button name "Change the height of the div".

In the test.html file, bind the onclick click event to the button button. When the button is clicked, execute the addheight() function.

In the js tag, create the addheight() function. Within the function, obtain the div object through id(mytest), use the height() method to obtain the height of the div, and then Use height() to set the height of the div again, for example, dynamically add 100px to the height of the div.

Open the test.html file in the browser and click the button to see the effect.

Recommended learning: "jquery video tutorial"

The above is the detailed content of How to change the height of an element in jquery. For more information, please follow other related articles on the PHP Chinese website!