爲什麼內聯塊不「可見」？

行內塊似乎使元素不匹配「：可見」選擇器？爲什麼內聯塊不「可見」？

$('body').append($('<p>').css('display', 'inline-block')) 
var p = $('p'); 
p.is(':visible'); 
==> false 

p.css('display', 'block'); 
p.is(':visible'); 
==> true

來源

2014-05-20 patrick

在這兩種情況下，您的代碼都會返回「false」，因爲您的元素應該從DOM中分離出來。 –

@ Mr.Alien OP正在創建一個新的'p'元素。 –

對不起，是的，我跳過了添加到我的示例代碼中的dom步驟 - 我更新了它。 – patrick

從jQuery的（http://api.jquery.com/visible-selector/）：如果他們消耗的文件空間

元素被認爲是可見的。可見元素的寬度或高度大於零。

空直列塊將具有0的高度和寬度（寬度是基於包含的元素）

enter image description here

一個空塊元件將具有父元素的寬度

http://i.snag.gy/cLLei.jpg

更多信息可以在w3.org上寬度如何用於在線和塊LEVE確定找到l元素。

編輯：正如FabrícioMatté指出的，這裏假設元素都是空的並附加到DOM。分離，即使塊元素沒有父節點來計算佈局，並將返回false。

來源

2014-05-20 18:04:48 Jack

當它們與文檔分離時，它們都不會消耗文檔中的空間。 –

你說得對。我將節點附加到文檔以進行驗證。 – Jack

猜你是對的，小提琴演示：http://jsfiddle.net/7HDJm/ –

爲什麼內聯塊不「可見」？

回答

相關問題