空标记元素和：可见？

我使用了最新的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

来源

2013-03-19 Royi Namir

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

@SubodhGhulaxe mmm..not到我的测试中.... HTTP：//i.stack.imgur.com/ fvl3j.jpg（18.02） – 2013-03-19 07:10:57

FF 19.0.2 - 显示“0” – inser 2013-03-19 07:13:27

@inser是正确的跨度是一个内联元素只有获得当它从而赢得宽度和其内容的高度内容布局 - 在这种情况下，宽度和高度都是0，所以不可见的，如果添加此CSS规则

.c { 
    display: block; 
}

您将看到警报现在显示1，因为您现在已经强制它成为一个块元素，因此继承其父元素的宽度并获得布局。

希望它能帮助，

干杯

来源

2013-03-19 07:23:56 forthehackofit

正确，但您也需要0宽度。因此，使用 '宽度：0;'或'浮动：左;' – inser 2013-03-19 07:28:04

实际上如果添加的宽度规则只是给它布局它是多余的，因为如通过CSS块元件它继承父的宽度，这意味着宽度： 100％; – forthehackofit 2013-03-19 07:32:06

空标记元素和：可见？

回答

相关问题