我能用js确定给定元素的显示css样式的当前状态吗

从jquery/sizzle源代码:

elem.offsetWidth > 0 || elem.offsetHeight > 0 // visible
elem.offsetWidth === 0 || elem.offsetHeight === 0  // hidden

哪里 elem 是一个dom元素。

现在我不完全确定为什么他们说元素是 看得见的 如果 任何一个 维度大于零。我想说,这两个维度都应该大于零,才能被称为“可见”,但我相信他们知道得更清楚。(可能一个空维度和另一个非零维度在浏览器中都是不可能的)。

更新: 关于这个主题还有另一个讨论,还有另一个解决方案(但还没有尝试过): How do I check if an element is really visible with JavaScript?

纯javascript方式,应该可以。

function getStyle(elementId){
   alert(document.defaultView.getComputedStyle(document.getElementById(elementId), '').getPropertyValue("display"));
}

function getDisplayStyle(elementId){   
 var display = document.getElementById(elementId).style.display;
 alert(display);
}

如果只查看display属性,则测量偏移量将起作用, 但是一个测试 能见度 需要查看(依赖于浏览器的)样式级联

document.deepCss=function(who, css){
 var val, dv= document.defaultView || window;
 val= who.style[css];
 if(!val){
  if(who.currentStyle) val= who.currentStyle[css];
  else val= dv.getComputedStyle(who,"").getPropertyValue(css);
 }
 return val || "";
}
function isVisible(who){
 return !!(document.deepCss(who,'visibility') != 'hidden' && 
 document.deepCss(who,'display') != 'none');
}

使用jquery,假设元素的id为myelement:

if($("#myElement").is(":visible")){
    // yep, it's visible - handle accordingly
}else{
    // nope, not visible
}

不不,不需要jquery。

如果那是显示:没有你要找的。否则对可见性做同样的事情:隐藏。

 if(mynode.style.display != "none")
    { ..  }
    else

$(document).ready( function () {
 if $('#id').hasClass('hidden') 
   $('#id').toggelClass('hidden');
);

hidden是用于隐藏元素的css类