2011-07-28 2 views
8

width CSS 속성이 'auto'로 설정된 요소의 너비를 픽셀 단위로 알아야합니다. element.style.width를 시도했지만 'auto'가 반환 되었기 때문에 작동하지 않았습니다. jquery 함수의 width()가 px의 길이를 반환한다는 것을 알았지 만, 내 페이지에서 jquery를 사용할 수 없기 때문에이 문제를 해결할 수 없습니다. 그래서, 누구 jquery 너비()에 대한 동등한 methos 알아?jquery width()에 해당하는 자바 스크립트

감사합니다.

+1

아마 관련 : (http://stackoverflow.com/questions/6826758/quick-resource-to-learn-more- [빠른 자원은 모든 JS 높이의에 대한 자세한 내용은] about-all-the-js-height/6826798 # 6826798). – jensgram

+2

[jQuery 소스] (http://code.jquery.com/jquery-1.6.2.js)의'getWH()'함수는 구현을 나타냅니다. (name = "width"로 불려진다.) – jensgram

답변

2

기본적으로 .offsetWidth이지만 jQuery 코드는 브라우저 간 차이로 인해 조금 더 복잡해졌습니다. jQuery를 사용

+1

또한 다양한 브라우저에서 다르게 구현되기 때문에 jQuery처럼 잘 테스트 된 것을 사용하면 의미가있다. – Tigraine

12

...

element.getBoundingClientRect().width 

내부적으로는 브라우저의 차이를 다루는 위에 다른 물건을 가지고있다.

크기를 렌더링하는 요소를 반환합니다. 여기서 .offsetxx는 상자 모델에 따라 크기를 반환합니다.

element.getBoundingClientRect() 

"실제"크기의 요소를 가져 오는 가장 정확한 방법은?

다음은 John Resig (jQuery의 저자)의 게시물입니다.

+0

사실, 매우 자주'$ el.width()'와 'el.getBoundingClientRect(). width'는 jQuery 2.1.4를 사용하여 최신 파이어 폭스와 크롬에서 정확한 값을 제공합니다. '$ el.outerWidth()'는 제로를 제공합니다. –

관련 문제