JavaScript问题：怎样判断一个 Element 是不可见的、隐藏的？

LoveTide 2003-10-09 02:18:51

我试图判断 anElement.style.display 是不是等于 "none"，但是发现这种做法有很多问题，比如这个 Element 继承了父 Element 的属性，则它的 style.display 等于 ""；还有，如果给他指定一个 class="xxxStyle"，这个 xxxStyle 包含display:none 样式，那么取出来的style.display还是""
------------
IE6.0
WinServer2003

...全文

177 7 打赏收藏转发到动态举报

写回复

用AI写文章

7 条回复

切换为时间正序

请发表友善的回复…

发表回复

liad 2003-10-09

打赏
举报

试一下使用theDiv.className来判断

if (theDiv.className != "InvisibleQuestion")

你应该把主要问题描述清楚，并贴出简单而且完整的html代码，能反映问题就行。我觉得那样提问题更好一些。

yoken 2003-10-09

打赏
举报

循环上溯，看parent element中有没有display:none

LoveTide 2003-10-09

打赏
举报

liad你好，这里是我的测试代码：

1、HTML 中的片段
-------------
<head>
<link href="main.css" rel="stylesheet" type="text/css">
</head>
<body>
<script>
var AllQuestionObjects = new Array (); // 用来存放所有“问题”的数组
</script>
...
...


<div id="div_Q_20" class="InvisibleQuestion">div_Q_20</div>
<script language="JavaScript">AllQuestionObjects.push ("div_Q_20");</script>

<div id="div_Q_21" class="Question"> div_Q_21</div>
<script language="JavaScript">AllQuestionObjects.push ("div_Q_21");</script>

<div id="div_Q_22" class="InvisibleQuestion">div_Q_22</div>
<script language="JavaScript">AllQuestionObjects.push ("div_Q_22");</script>

<div id="div_Q_23" class="Question"> div_Q_23</div>
<script language="JavaScript">AllQuestionObjects.push ("div_Q_23");</script>

<input type="button" name="Button" value="ReArrange" onClick="ReArrangeQuestion()">
<script language="JavaScript">
function ReArrangeQuestion ()
{
//alert (AllQuestionObjects.join(","));
var i=0;
var AllVisibleQuesiton = new Array (); // 用来存放所有可见的“问题”的数组
var theDiv ;

for (i=0; i<AllQuestionObjects.length; i++)
{
theDiv = eval (AllQuestionObjects[i]);
if (theDiv != null)
{
if (theDiv.currentStyle.display != "none") // !!! 问题就在这里，原先我用的是 theDiv.style.display != "none"，得不到正确的逻辑，后来查msdn发现这个 style 只是在html代码中内嵌的style，不是CSS中定义的style
{
// do sth...
}
}
}
//alert (AllVisibleQuesiton.join(","));
// .............
}
</script>

2、Main.CSS片段
------------------------------------
div.question
{
}
div.InvisibleQuestion
{
position:absolute;
display:none;
}

liad 2003-10-09

打赏
举报

你可不可以给段代码出来测试呢？谢谢

LoveTide 2003-10-09

打赏
举报

http://msdn.microsoft.com/workshop/author/dhtml/reference/objects/currentstyle.asp?frame=true

LoveTide 2003-10-09

打赏
举报

楼上的没仔细看我的内容，只看了我的标题，如果只来混分的就算了吧……

我又查了一下msdn, 发现 “style 对象” 只是取得在 html 里内嵌的那部分style，要获取从CSS或者继承下来的style属性，需要用到 “currentStyle 对象”

...

liad 2003-10-09

打赏
举报

form_1.text1.style.visibility

<form name="form_1">
<input name="text1" style="visibility: visible;" type="text" value="Hello, world">
</form>

visibility

--------------------------------------------------------------------------------

Description

Indicates whether the content of a positioned element is displayed.

Syntax
{ visibility: visible | hidden | inherit}

Remarks

Unlike display:none, elements that are not visible still reserve the same physical space in the content layout as they would if they were visible. Changing the visibility through scripting is useful for showing and hiding content based on a user interaction. Note that for a child element to be visible, the parent element must also be visible. See Dynamic Styles for document style scripting information.

This attribute is not inherited.

Applies To

A, ADDRESS, APPLET, B, BIG, BLOCKQUOTE, BODY, CAPTION, CENTER, CITE, CODE, COL, COLGROUP, DD, DFN, DIR, DIV, DL, DT, EM, EMBED, FIELDSET, FORM, H1, H2, H3, H4, H5, H6, HR, HTML, I, IFRAME, IMG, INPUT, KBD, LABEL, LEGEND, LI, LISTING, MARQUEE, MENU, OBJECT, OL, P, PRE, S, SAMP, SELECT, SMALL, SPAN, STRIKE, STRONG, SUB, SUP, TABLE, TBODY, TD, TEXTAREA, TFOOT, TH, THEAD, TR, TT, U, UL, VAR, XMP, INPUT type=button, INPUT type=file, INPUT type=reset, INPUT type=submit, INPUT type=text, INPUT type=checkbox, INPUT type=radio, INPUT type=image

Scripting Property

visibility

See Also