What are the jquery style operations?

青灯夜游
Release: 2021-11-16 17:00:45
Original
2338 people have browsed it

jquery style operation: 1. Use css() to set or return the style attribute of the matching element; 2. Use height() to set or return the height of the matching element; 3. Use offset() to return the first match The position of the element relative to the document; 4. Use offsetParent() to return the nearest positioned ancestor element, etc.

What are the jquery style operations?

The operating environment of this tutorial: windows7 system, jquery1.10.2 version, Dell G3 computer.

Style operations in jquery

1. css()

css() method Returns or sets one or more style properties of the matched element.

Syntax:

//返回样式属性值
$(selector).css(name)

//设置样式属性
$(selector).css(name,value)
$(selector).css({property:value, property:value, ...})
Copy after login

2. height()

height() method returns or sets the height of the matching element.

Syntax:

//返回样式高度
$(selector).height()

//设置样式高度
$(selector).height(length)
Copy after login

3. width()

width() method returns or sets the width of the matching element.

Syntax:

$(selector).width()
$(selector).width(length)
Copy after login

4, offset()

offset() method returns or sets the offset (position) of the matching element relative to the document .

Syntax:

$(selector).offset()
$(selector).offset(value)
Copy after login

5. offsetParent()

offsetParent() method returns the nearest ancestor positioned element.

Positioned elements refer to elements whose CSS position property is set to relative, absolute, or fixed.

Position can be set through jQuery, or through the CSS position property.

Syntax:

$(selector).offsetParent()
Copy after login

6. position()

The position() method returns the position (offset) of the matching element relative to the parent element.

The object returned by this method contains two integer properties: top and left, measured in pixels.

This method is only valid for visible elements.

Syntax:

$(selector).position()
Copy after login

7, scrollLeft()

scrollLeft() method returns or sets the horizontal position of the scroll bar of the matching element.

The horizontal position of the scroll bar refers to the number of pixels scrolled from its left side. When the scroll bar is at the far left, the position is 0.

Syntax:

//返回水平滚动条位置
$(selector).scrollLeft()

//设置水平滚动条位置
$(selector).scrollLeft(position)
Copy after login

8, scrollTop()

scrollTop() method returns or sets the vertical position of the scroll bar of the matching element.

scroll top offset refers to the offset of the scroll bar relative to its top.

If this method does not set parameters, returns the offset in pixels relative to the top of the scroll bar.

Grammar:

$(selector).scrollTop(offset)
Copy after login

Related tutorial recommendations: jQuery video tutorial

The above is the detailed content of What are the jquery style operations?. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!