CSS:
#test {
visibility: hidden;
width: 400px;
height: 400px;
background-color: orange;
}
#subTest {
width: 100px;
height: 100px;
background-color: gray;
}
HTML:
<div id="test">
<div id="subTest"></div>
</div>
JavaScript:
$(function() {
var test = document.getElementById('test'),
subTest = document.getElementById('subTest');
console.log("getClientRects,length = " + subTest.getClientRects().length);
console.log("offsetParent = " + subTest.offsetParent);
console.log("JQuery isVisible = " + $("#subTest").is(":visible"));
});
结果:
getClientRects,length = 1
offsetParent = [object HTMLBodyElement]
JQuery isVisible = true
似乎所有方法都无效。
那么如何检查#subTest是否可见?
答案 0 :(得分:0)
我不认为这是可能的。出于某种原因,它们被称为级联样式表。父元素和子元素之间存在语义。
然而,作为解决方法,您可以克隆它并显示克隆。不知道为什么你想要。我认为您更有可能需要更改标记,以便标记更有效地适应用例。
然而,因为我提到它。这是......
<强> CODE:强>
var someElement = jQuery('#subDiv').clone();
someElement.appendTo('someOtherElement');
希望这有帮助,
添
答案 1 :(得分:0)
此
$('#subTest').css('visibility') == 'hidden' // true
由于父母是hidden
,它将级联到孩子身上。