2013-03-19 38 views
3

我使用了最新的jQuery版本(1.9.1)空標記元素和:可見?

我有一個空span元素:

<!DOCTYPE html> 
<html> 

    <head> 
     <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
     <meta charset=utf-8 /> 
     <title>JS Bin</title> 
    </head> 

    <body> <span class="c"></span> 

    </body> 
    <script type='text/javascript'> 
     alert($(".c:visible").length); 
    </script> 

</html> 
  • Chrome瀏覽器(最新版)提醒0
  • FF(最新版本)警報1
  • IE(8)警報0

爲什麼不在Chrome中提示1?元素不隱藏。

我可以解決此通過使用過濾器和吐出所有的!display:none,但想知道如果我做錯什麼

http://jsbin.com/urihov/2/edit

+2

在FF和Safari它提醒0 – 2013-03-19 07:10:09

+0

@SubodhGhulaxe mmm..not到我的測試中.... HTTP://i.stack.imgur.com/ fvl3j.jpg(18.02) – 2013-03-19 07:10:57

+0

FF 19.0.2 - 顯示「0」 – inser 2013-03-19 07:13:27

回答

1

@inser是正確的跨度是一個內聯元素只有獲得當它從而贏得寬度和其內容的高度內容佈局 - 在這種情況下,寬度和高度都是0,所以不可見的,如果添加此CSS規則

.c { 
    display: block; 
} 

您將看到警報現在顯示1,因爲您現在已經強制它成爲一個塊元素,因此繼承其父元素的寬度並獲得佈局。

希望它能幫助,

乾杯

+0

正確,但您也需要0寬度。 因此,使用 '寬度:0;'或'浮動:左;' – inser 2013-03-19 07:28:04

+0

實際上如果添加的寬度規則只是給它佈局它是多餘的,因爲如通過CSS塊元件它繼承父的寬度,這意味着寬度: 100%; – forthehackofit 2013-03-19 07:32:06