如何在javascript中动态隐藏对象

rde*_*fin 1 javascript css visibility javascript-events

我有一个网页,您可以使用自己的帐户登录.这个想法是,当你按下你的名字时,会出现一个小方块(类似于stackoverflow所做的)以及你的一些基本信息(名称,电子邮件等).它是php,css和javascript的混合,但php只能选择用户的名字.所以,我有以下代码:

<style type="text/css">
table.UserInfo
{
    background-color:#000;
    width:100;
    height:100;
    position:fixed;
    top:10px;
    right:10px;
}
p.UserText
{
    color:#FFF;
}
</style>
<script type="text/javascript">
function showUser()
{
    //Unknown code here
}
</script>
Run Code Online (Sandbox Code Playgroud)

在页面的某些部分......:欢迎访客!

实际上访问者通过php设置为登录的用户或访问者(如果没有).这是方框:

<table class='UserInfo' id='UserInfo' >
<tr>
<td><p class='UserText'>This user is a guest user. There is no information available.</p></td>
</tr>
</table>
Run Code Online (Sandbox Code Playgroud)

因此,当我按下访问者时,我需要显示该框,因此代码将显示在showUser()中,我需要知道我必须放置我的javascript代码,以便最初隐藏框.对于我按下它时显示的框,我尝试将此代码放在showUser()函数中:

document.getElementById('UserInfo')style.visibility = 'hidden';
Run Code Online (Sandbox Code Playgroud)

但它没有用.我把它隐藏起来,因为它开始是可见的.

谢谢

Jul*_*ian 8

你也可以这样做:

var_name = document.getElementById("idname").style.display = 'none';
Run Code Online (Sandbox Code Playgroud)