Jquery function learning 5 (CSS)

That is, operations on styles in DOM elements

Function: CSS (name)
Function: gets the value of the specified attribute name of the matching element.
Return Value: String
Parameter: name of the style attribute to be accessed
Example:
Retrieves the Color Style of the first paragraph

Jquery code
$ ("P" ).css ("color ");
Before
<PStyle= "Color: red ;">Test paragraph.</P>
Result:
"Red"

Retrieves the font-weight style of the first paragraph.

Jquery code
$ ("P" ).css ("font-weight ");
Before
<PStyle= "Font-weight: bold ;">Test paragraph.</P>
Result:
"Bold"

 

 

Function: CSS (properties), CSS (Key, value)
Function: sets a set of styles and a style.
Return: jquery object
Parameter: attribute array object, attribute name/value
Example:
Sets color and background styles to all P elements.

jquery Code
$ ("p" ).css ({color: "red", Background: "blue "});
before
P > test paragraph. P >
result:
P style =" color: red; Background: Blue; " > test paragraph. P >

Changes the color of all paragraphs to red

Jquery code
$ ("P" ).css ("color", "Red ");
Before
<P>Test paragraph.</P>
Result:
<PStyle= "Color: red ;">Test paragraph.</P>

Changes the left of all paragraphs to "30px"

Jquery code
$ ("P" ).css ("Left", 30 );
Before
<P>Test paragraph.</P>
Result:
<PStyle= "Left: 30px ;">Test paragraph.</P>

 

 

Function: height (), height (VAL)
Function: gets the height of the First Matching Element. Height (VAL) sets the height of all matching elements.
Return Value: String
Example:
Jquery code
$ ("P"). Height ();
Before
< P > This is just a test. </ P >
Result:
300

jquery Code
$ ("p "). height (20);
before
P > This is just a test. P >
result:
P style =" height: 20px; " > This is just a test.

Jquery code
$ ("P"). Height ("20em ");
Before
<P>This is just a test.</P>
Result:
<PStyle= "Height: 20em ;">This is just a test.</P>

 

 

function: width (), width (VAL)
function: Get the width of the first element, width (VAL) set the width of all matching elements
example: if the width is similar to the preceding value, it is not listed.