📜  jQuery | css() 方法

📅  最后修改于: 2021-11-25 04:32:49             🧑  作者: Mango

JQuery库支持几乎所有包含在级联样式表 (CSS) 中的选择器。 JQuery 中css()方法用于更改所选元素的样式属性。 JQuery 中的css()可以以不同的方式使用。
css() 方法可用于检查所选元素的属性的当前值:

句法:

$(selector).css(property)

返回值:它将返回所选元素的属性值。

示例 1:

Input: $("p").css("color");
Output: Output of the above input will return the 
rgb() value of the element.

代码#1:

HTML

 

    

 

    
    

Wecome to gfg!

   


HTML

 

    

 

    
    

              Wecome to gfg!.

   


HTML

 

    

 

    
    

              Welcome to gfg!.

   


HTML



  Document

 
 
    

            Welcome to gfg!.

            


输出:
在点击按钮之前——

点击按钮后——

css() 方法还用于添加或更改所选元素的属性。

句法:

$(selector).css(property, value)

返回值:这将更改所选元素的属性值。

示例 2:

Input: $("p").css("color", "red");
Output: Output of the "p" element becomes red 
whatever may be the color previously.

代码#2:

HTML


 

    

 

    
    

              Wecome to gfg!.

   

输出:
在点击按钮之前——

点击按钮后——

css() 方法可以使用函数来更改所选元素的 css 属性:

句法:

$(selector).css(property, function(index, currentvalue))

返回值:它将返回所选属性的更改值。

示例 3:

Input: $("p").css("padding", function(i){ return i+20;});
Output: Output will get is the paragraph with padding value
 increases to "25px" whatever be the initial value.

代码#3:

HTML


 

    

 

    
    

              Welcome to gfg!.

   

输出:
在点击按钮之前——

点击按钮后——

在 css 方法的帮助下,我们还可以在 JQuery 中一次应用多个属性。

注意:在这个方法中,我们用驼峰命名法写入属性名称。

句法:

$(selector).css({property:value, property:value, ...})

代码#4:

HTML




  Document

 
 
    

            Welcome to gfg!.

            

输出:

在点击按钮之前——

点击按钮后——