Bug Tracker

Modify

Ticket #10159 (closed bug: wontfix)

Opened 3 years ago

Last modified 2 years ago

.outerHeight() returns positive value for <script> elements

Reported by: yelo3 Owned by: yelo3
Priority: low Milestone: None
Component: dimensions Version: 1.6.2
Keywords: Cc:
Blocking: Blocked by:

Description

I think I have found a bug in the .outerHeight() jquery function. I'm trying to the the height of the children of <body>, and it appears that <script> tags have a height > 0 (in this case I get 20, in chrome browser). This is not expected: in my opinion they should have a height = 0.

THIS IS MY CODE.

<html> <head>

<script type="text/javascript" src=" http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"> </script> <script type="text/javascript">

$(document).ready(function() {

var children = $(document.body).children();

for (i=0; i<children.length; i++) {

height = $(children[i]).outerHeight(true); console.log("height=" + height);

}

});

</script>

</head> <body>

<script type="text/javascript"> var a=1; var b=2; var c=3; </script>

<div>

<p>hello1</p> <p>hello2</p> <p>hello3</p>

</div>

</body> </html>

Change History

comment:1 Changed 3 years ago by timmywil

  • Owner set to yelo3
  • Priority changed from undecided to low
  • Status changed from new to pending
  • Component changed from unfiled to dimensions

Thanks for taking the time to contribute to the jQuery project! Please provide a complete reduced test case on jsFiddle to help us assess your ticket.

Additionally, be sure to test against the jQuery Edge version to ensure the issue still exists. To get you started, use this boilerplate:  http://jsfiddle.net/FrKyN/ Open the link and click to "Fork" (in the top menu) to get started.

comment:2 Changed 3 years ago by yelo3

  • Status changed from pending to new

I've done what you requested:

 http://jsfiddle.net/FrKyN/13/

comment:3 Changed 3 years ago by rwaldron

Further, clearer reduction:

 http://jsfiddle.net/rwaldron/FrKyN/14/

Version 0, edited 3 years ago by rwaldron (next)

comment:4 Changed 3 years ago by yelo3

 http://jsfiddle.net/FrKyN/15/

also <style> tag is affected

comment:5 Changed 3 years ago by dmethvin

  • Status changed from new to open

comment:6 Changed 3 years ago by mikesherov

This happens because the width/height cssHook does a visibility swap when it encounters an element with no offsetWidth/offsetHeight. It reports a value because even style and script tags can get width/height when they are absolutely positioned and given display:block.

Two options:

  1. needsdoc that it reports weird values for style/script
  2. before visibilty swapping, detect nodeName "STYLE" or "SCRIPT", which begs the question of "what other elements should always report zero besides style and script?".

I'll open a PR just in case we want to go with option 2.

comment:7 Changed 3 years ago by timmywil

I'm inclined to say needsdocs. It seems pretty obvious that one shouldn't call width/height on style or script tags. And why loop through all of the elements on the page? I can't actually see where that would be useful.

comment:8 Changed 3 years ago by mikesherov

Also is broken on input:hidden tags in chrome. I opened a PR just in case:  https://github.com/jquery/jquery/pull/547

It's pretty small. Also, here's the perf... looks pretty good:  http://jsperf.com/outerwidth-on-hidden-elements

comment:9 Changed 2 years ago by dmethvin

  • Keywords needsdocs added
  • Status changed from open to closed
  • Resolution set to wontfix

comment:10 Changed 2 years ago by addyosmani

  • Keywords needsdocs removed

Initial docs added to  http://api.jquery.com/height/. I've pinged Dave and Karl about turning the notes into a reusable.

Please follow the  bug reporting guidlines and use  jsFiddle when providing test cases and demonstrations instead of pasting the code in the ticket.

View

Add a comment

Modify Ticket

Action
as closed
Author


E-mail address and user name can be saved in the Preferences.

 
Note: See TracTickets for help on using tickets.