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

form_1.text1.style.visibility<form name="form_1">
<input name="text1" style="visibility: visible;" type="text" value="Hello, world">
</form>
visibility--------------------------------------------------------------------------------DescriptionIndicates whether the content of a positioned element is displayed. 
Syntax
{ visibility: visible | hidden | inherit}ResUnlike 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 ToA, 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 PropertyvisibilitySee Also

解决方案 »

  1.   

    楼上的没仔细看我的内容，只看了我的标题，如果只来混分的就算了吧……我又查了一下msdn, 发现 “style 对象” 只是取得在 html 里内嵌的那部分style，要获取从CSS或者继承下来的style属性，需要用到 “currentStyle 对象”...
      

  2.   

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

  3.   

    liad你好，这里是我的测试代码：1、HTML 中的片段
    -------------
    <head>
    <link href="main.css" rel="stylesheet" type="text/css">
    </head>
    <body>
    <script>
    var AllQuestionObjects = new Array (); // 用来存放所有“问题”的数组
    </script>
    ...
    ...<!-- 这些 div 都是我动态生成的，没遇到一个就把它的ID加入存放“问题”的数组中 -->
    <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;
    }
      

  4.   

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

  5.   

    试一下使用theDiv.className来判断if (theDiv.className != "InvisibleQuestion")你应该把主要问题描述清楚，并贴出简单而且完整的html代码，能反映问题就行。我觉得那样提问题更好一些。