1.css
Get the color of P:
$ (document). Ready (function () {
var p= $ ("P"). CSS ("color");
Alert (p);
});
Sets the color of the paragraph font to red:
$ (document). Ready (function () {
$ ("P"). CSS ("Color", "red");
});
Sets the color of the paragraph font to red and the background color to blue:
$ (document). Ready (function () {
$ ("P"). CSS ({color: "Red", Background: "Blue"});
});
<body>
<div>test1</div>
<div id= "D" >test2</div>
<input type= "text" value= "textbox"/>
<input type= "Submit"/>
<p>p</p>
</body>
2. Location
Offset () Gets the relative offset of the matching element at the current viewport. The returned object contains two integer properties: Top and left. This method is valid only for visible elements.
Get the location of the P2 paragraph:
$ (document). Ready (function () {
var p=$ ("P:last");
P.html ("Left:" + P.offset (). Left + ", top:" + P.offset (). top);
});
Set the position of the P2 paragraph:
$ (document). Ready (function () {
$ ("P:last"). Offset ({top:150,left:20});
});
Position () Gets the offset of the matching element relative to the parent element. The returned object contains two integer properties: Top and left.
Gets the position offset of the first paragraph relative to the second paragraph:
$ (document). Ready (function () {
var p=$ ("P:first");
$ ("P:last"). HTML ("Left:" +p.position (). left+ ", Top:" +p.position (). top);
});
ScrollTop () Gets the offset from the top of the scrollbar relative to the element
Gets the offset from the top of the first paragraph relative to the scroll bar
$ (document). Ready (function () {
var p=$ ("P:first");
$ ("P:last"). Text ("ScrollTop:" +p.scrolltop ());
});
ScrollLeft () Gets the offset to the left of the matching element relative to the scrollbar.
<body>
<div>test1</div>
<div id= "D" >test2</div>
<input type= "text" value= "textbox"/>
<p>p1</p>
<p>p2</p>
</body>
3. Dimensions
Height () Gets, sets the height of the element, width () gets, sets the length of the element
$ (document). Ready (function () {
$ ("P:last"). Text ("P2 Height:" +$ ("P:last"). Height ());
});
Set the height of the P2:
$ (document). Ready (function () {
$ ("P:last"). Height (30);
});
The inner area height of the innerheight () element (including padding, excluding borders). The width of the inner area of the innerwidth () element (including padding, excluding borders).
$ (document). Ready (function () {
var p = $ ("P:first");
$ ("P:last"). Text ("Innerheight:" + p.innerheight ());
});
Outerheight () Gets the outer height of the matched element (including padding and borders by default). Outerwidth () Gets the outer width of the matched element (including padding and borders by default).
$ (document). Ready (function () {
var p = $ ("P:first");
$ ("P:last"). Text ("Outerwidth:" + p.outerwidth ());
});
jquery Action on CSS