使用 jQuery 单击后，如何将 div 的宽度增加指定的像素？

在本文中，我们将学习如何使用 jQuery 在单击后按指定像素增加分区的宽度。

我们可以使用用于在 JQuery 中返回和设置元素宽度的width()方法来完成此任务。因此，当我们单击它时，会调用一个函数，在该函数中，我们首先使用 width() 方法将 div 的当前宽度存储在一个变量中，然后增加指定的像素并使用 JQuery 中的 width(value) 方法设置其宽度。

句法：

// To return the width of the selected element
$(selector).width()

// To set the width of the selected element
$(selector).width(value)

例子：

HTML

 

    
    
 
    
        body {
            color: green;
            font-size: 30px;
        }
 
        div {
            font-size: 40px;
            background-color: rgb(190, 190, 190);
            width: 300px;
            border: solid 4px red;
        }
 
        button {
            font-size: 30px;
        }
    

 

    
        GeeksforGeeks
        
            Click to Div to increase the width
        
    
 
    
         
        // Width of the div before clicking button
        var w = $("div").width();
 
        // Increment that we want to do
        var inc = 200;
        function fun() {
 
            // Increase width by 200 and set
            $("div").width(w + inc);
        }
    

 

输出：