jQuery.css ('width')가 다른 브라우저에서 다른 값을 반환하는 이유는 무엇입니까?

필자는 테이블의 열 너비를 읽고 다른 테이블에 적용하는 jQuery 코드를 작성했습니다.jQuery.css ('width')가 다른 브라우저에서 다른 값을 반환하는 이유는 무엇입니까?

<table style='table-layout:fixed;'> 
    <tbody id='myTableBody'> 
     <tr> 
      <td style='width:100px;'>foo</td> 
      <td style='width: 40px;'>bar</td> 
     </tr> 
    </tbody> 
</table>

내가이 테이블의 CSS를 폭 속성을 읽을 수있는 다음과 같은 jQuery 코드 작성했습니다 : 코드 후

var colWidths = []; 
var cells = $('#myTableBody').find('td'); 
for (i = 0; i < cells.length; i++) 
    colWidths.push($(cells[i]).css('width'));

을

내 페이지에서

,이 같은 표가 실행, 나는 colWidths가 [100, 40]이고, FireFox에있을 것으로 기대합니다. 그러나 IE8에서는 [92,32]입니다. 이것은 올바른 값에 의존하는 IE에서 내 페이지를 깰.

내 테이블이 jQuery-ui-tabs 요소에 포함되어 있고 jQuery-ui css가 이상한 것들을 처리 할 수 있다는 것을 알았 기 때문에 이것이 무언가 있다면 놀랄 일이 아닙니다. 그것과 관련이있다.

jQuery.css ('width')가 IE8에서 예상 한 값을 반환하지 않는 이유는 무엇입니까? 그것에 대해 무엇을 할 수 있습니까?

출처

2012-03-07 Daniel Allen Langdon

40에 일관된 가치를 제공은 : http://jsfiddle.net/QhXjS/ –

이 페이지 유효한 HTML 4.01인가 페이지? 아마도 IE8에서 [quirksmode] (http://www.quirksmode.org/css/quirksmode.html)를 실행했을 것입니다. – Zeta

고마워요. @ Rob W. 저는 제 페이지에 무언가가있어서 잘못된 값을 얻게 될 것이라고 내기하고 있습니다. –

JQuery는이 상황에서 브라우저 처리를 $().width()을 통해 정상화합니다.

css("width")은 정규화되지 않은 다른 속성/속성이지만 대신 요소의 CSS 값을 검색합니다. width()은 "dom의 실제 크기"이지만 css("width") 만 CSS 값을 검색하는 경우 적용 할 수있는 경우 여백과 여백을 사용하지 않습니다. 다른 사람들이이 대답 아래에서 언급했듯이 .outerWidth()은 .width()이 수행하는 작업을 수행하지만 은 네이티브 브라우저가 나타내는 여백과 여백을 포함합니다. 요컨대

$(this).css("width")

은 $(this).width() 또는 $(this).height()보다

$(this).attr("name")

에 가까운 :

$(this).width() != $(this).css("width")

좋은 평행이 예이다.

편집 : 경고는 숫자 값 (픽셀)입니다

$(this).css("height", "auto"); alert($(this).height());

: 여기

도 차이를 보여 내가 그냥 탭 무언가 톱이다.

출처

2012-03-07 20:38:29

그런 경우 실제 CSS의 너비 값을 검색하려면 어떻게해야합니까? –

실제로 너비의 "CSS"값이 필요합니까? 아니면 클라이언트 브라우저 창에서 실제 크기? $ (this) .width()는 "네이티브 브라우저에서 보이는 실제 너비 요소의 모습" –

시도 .outerWidth() –

본문의 너비를 감지하고 특정 스크립트를로드하려고 할 때 같은 문제에 직면했습니다.이 방법으로이 문제를 해결했습니다. 너를 도울 수있어.

$('body,html').css({'overflow':'hidden'}); 
var width = $('body').width(); 
$('body,html').css({'overflow':''});

이 모든 주요 브라우저 IE8에서

나는 100 얻을

출처

2014-09-27 15:05:59 Anush

jQuery.css ('width')가 다른 브라우저에서 다른 값을 반환하는 이유는 무엇입니까?

답변

관련 문제