我已在此sitepoint page和quirksmode page中读到有关新:empty
伪类的信息。
Sitepoint表示,即使附加了动态内容,空样式仍然会生效。值得注意的是,firefox就是这样行事的人。
Quirksmode说当它填充一些元素或文本时,它会丢弃空状态。此站点上的演示可在我的浏览器中运行(chrome 19)。所以我假设只有firefox会出错。
但是我在我的插件中有这段代码,它动态填充带有项目的列表,它似乎不起作用,here's a fiddle附加列表项,即使你点击按钮,项目在您尝试在控制台中调试它之前不会出现(当您单击元素树中的<li>
时,它们会神奇地出现)。
为什么会发生这种情况,是否有办法“强行抛弃”空洞的风格?
我知道还有其他方法可以做我在小提琴中做的事情(目前正在做其中一种“其他方式”),但:empty
方法要容易得多。
更新:
添加了删除项目按钮。删除最后一项时,列表应该消失 - 仍然不起作用。嗯..我会尝试检查另一个浏览器。
FIX
使用:empty
和display:none
的临时修复/替代方法是让元素为width
,height
,borders
,margins
和paddings
。另外,position:absolute
将其从流程中删除。
答案 0 :(得分:5)
你提供的小提琴适用于FF10和IE9。它只能在Chrome(18 +)
中失败不确定为什么会这样,因为quirksmode页面也适用于Chrome ..
对于 force-discard ,似乎可以通过设置几乎任何带代码的css属性来实现。
示例http://jsfiddle.net/gaby/YprUV/9/
<强>更新强>
好的,我发现这个Chrome bug report与:empty
display:none
选择器行为不端
它标记为固定,但也许我们应该重新打开它。
这是一个不使用display:none
的测试(它只是更改了背景颜色),它运行得很好.. http://jsfiddle.net/YprUV/11/