请教一个CSS跟JQ的问题。

Question

为什么父元素用了display：none后 子元素的宽度输出的不是PX值而是百分比值
JQ源代码我也看不懂求大神指教。
父元素取消display none后就是输出PX值了。
如果父元素宽高都是百分比。要输出子元素的PX值的话有什么方法吗。

Answer 1

你都 display 父元素了所以子元素查询不到具体的宽度了（此时子元素和父元素都隐藏了），感觉是这个原因

Answer 2

页面渲染的时父级元素就先隐藏了，子元素就没有实际计算出PX宽度，所以获取到的是设置的百分比宽度。
父元素显示后，子元素在页面渲染时会计算出相对于父元素百分比的实际宽度PX，所以JQ获取到的是子元素的实际px像素。我觉得应该是这样。试试父级元素用visibility:hidden;在用jq获取百分比试试，或者父级元素display：none用JQ去控制，这样再获取子元素,应该就是实际PX像素了，一切都跟页面渲染有关系。以上是理论，你试一下可以的话回我下，谢谢~！一起学习进步

Answer 3

不只是jquery，在原生中加上display：none输出一样是百分比，可以找它的父元素先计算出宽度，然后计算子元素的宽度，如果父元素也设置了display：none，就只有继续往外面找；可以写个递归算法。
像上面说的visibility:hidden是可以计算出实际高度的，但设置visibility:hidden之后元素是还会占位置的，看具体需求吧

Answer 4

高度改为0；然后overflow：hidden；的方法。 不知道大家还有什么好的方法没。

Answer 5

一句话:不可能！你用浏览器F12打开看看display:none的高度是多少，看不了吧，连浏览器都不知道高度jq怎么可能知道。为了性能浏览器是不会渲染none的元素的，自然获取不到要渲染的属性。
你可以用visibility:hidden;代替，不过这种方法隐藏的元素依然处于文档流之中。