查找元素是否可见(JavaScript)

Dev*_*ard 9 javascript jquery dom visible getattribute

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

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

这是我尝试过的两种不同方法的代码:

var myvar = $("#mydivID").is(":visible");
var myvar = document.getElementById("mydivID").getAttribute("display");
Run Code Online (Sandbox Code Playgroud)

任何指导或协助将不胜感激.

pal*_*aѕн 19

试试这样:

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

小提琴

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

<head>
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
Run Code Online (Sandbox Code Playgroud)

  • @amnotiam - 虽然他说它不起作用,Palash的代码看起来也完全有效. (2认同)
  • @Derek 我会功夫:不,我们或许可以假设 OP *打算* 定义 jQuery,但这并不意味着它实际上已定义。我在这个答案中遇到的问题是,问题指出 *“这是我尝试过的”`$("#mydivID").is(":visible")`*,答案是 *“好的,然后试试这个” `$("#mydivID").is(":visible")`*,它没有添加任何有用的信息。 (2认同)

Sei*_*Sys 10

Display不是属性,它是属性中的CSS style属性.

你可能正在寻找

var myvar = document.getElementById("mydivID").style.display;
Run Code Online (Sandbox Code Playgroud)

要么

var myvar = $("#mydivID").css('display');
Run Code Online (Sandbox Code Playgroud)


Gau*_*rav 8

如果您想以javascript方式执行此操作,您可以尝试

window.getComputedStyle(document.getElementById("mydivID"),null).getPropertyValue('display')
Run Code Online (Sandbox Code Playgroud)


Nir*_*kku 7

让我们花一点时间来看看.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;
};
Run Code Online (Sandbox Code Playgroud)

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

这也是值得注意的,当jQuery检查元素是否被隐藏时(例如,当触发'toggle'事件时),它会对显示属性及其在dom中的存在执行检查.https://github.com/jquery/jquery/blob/master/src/css.js#L43