jQuery / Method / .width()

.width()

.width()는 선택한 요소의 가로 크기를 반환하거나, 가로 크기를 변경합니다.

문법 1

선택한 요소의 가로 크기를 반환합니다. 예를 들어

는 p 요소의 가로 크기를 변수 jbVar에 저장합니다.

문법 2

선택한 요소의 가로 크기를 변경합니다. 예를 들어

는 h1 요소의 가로 크기를 100px로 만듭니다.

예제 1

선택한 요소의 가로 크기를 출력합니다. 가로 크기를 %로 지정해도 반환되는 값의 단위는 px입니다.

예제 2

버튼을 클릭하면 요소의 가로 크기가 변합니다.

참고

  • 가로 크기는 내용 영역(Content Area)이 기준입니다. 즉, 박스 모델에서 바깥 여백 영역(Margin Area), 테두리 영역(Border Area), 안쪽 여백 영역(Padding Area)을 제외한 부분의 가로 크기입니다.