Question

我有一个javascript函数，它试图确定div是否可见并使用该变量执行各种处理。我成功地通过改变它在none和block之间的显示来交换元素可见性;但我无法存储这个值......

我尝试获取元素显示属性值并查找元素ID是否可见但是两者都没有效果。当我尝试.getAttribute时，它总是返回null;我不知道为什么，因为我知道id是定义的，它有一个显示属性。

以下是我尝试的两种不同方法的代码：

var myvar = $("#mydivID").is(":visible");
var myvar = document.getElementById("mydivID").getAttribute("display");

非常感谢任何指导或协助。

Answer 1

试试这样：

$(function () {
    // Handler for .ready() called.
    if ($("#mydivID").is(":visible")) {
        alert('Element is visible');
    }
});

FIDDLE

请确保在head标记中包含jQuery文件，如下所示

<head>
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>

Answer 2

显示不是属性，它是style属性中的CSS属性。

您可能正在寻找

var myvar = document.getElementById("mydivID").style.display;

或

var myvar = $("#mydivID").css('display');

Answer 3

如果你想以javascript方式这样做，你可以尝试

window.getComputedStyle(document.getElementById("mydivID"),null).getPropertyValue('display')

Answer 4

让我们花点时间看看.is(":visible")在jQuery中做了什么，不是吗？

这是一个链接：https://github.com/jquery/jquery/blob/master/src/css.js#L529

return !jQuery.expr.filters.hidden( elem );

，其中

jQuery.expr.filters.hidden = function( elem ) {
    // Support: Opera <= 12.12
    // Opera reports offsetWidths and offsetHeights less than zero on some elements
    return elem.offsetWidth <= 0 && elem.offsetHeight <= 0;
};

所以，它只是检查元素的偏移宽度和高度。

那说，并且值得注意的是，当jQuery检查元素是否隐藏时（例如，当触发'toggle'事件时），它会对显示执行检查属性及其存在于dom 。 https://github.com/jquery/jquery/blob/master/src/css.js#L43

Answer 5

var myvar = $("#mydivID").is(":visible"); //这是JQUERY，如果可见则返回true

var myvar = document.getElementById("mydivID").getAttribute("display"); //HERE Display 不是一个属性，所以这不会给出想要的结果。

我的解决方案

1.Select the element using QuerySelector
var myvar= document.querySelector('ELEMENT');

2.Check the OffsetWidth and Offsetheight to be greater than 0;
(myvar.offsetWidth > 0 || myvar.offsetHeight > 0)

3.if myvar is Greater than 0 then it's visble else not.

查找元素是否可见（JavaScript）

5 个答案: