2011-09-17 60 views
3

我有这样的HTML:如何在纯Javascript中删除和隐藏HTML元素?

<body> 
    <div id="content-container" style="display:none"> 
     <div>John</div> 
    </div> 
    <div id="verifying"> 
     <div id="message">Verified</div> 
    </div> 
</body> 

而且此Javascript:

var body = document.body; 
var signup = document.getElementById("content-container"); 

setTimeout(function(){ 
    body.removeChild('verifying'); 
    signup.style.display = "block"; 
}, 5000); 

我试图删除<div id="verifying">并显示<div id="content-container">后5秒,但由于某种原因它不工作。任何想法为什么?我在加载页面后加载脚本,这不是问题。

+0

为什么不隐藏验证?所以像这样:'document.getElementById(“content-container”)。verifying.style.display =“none”;' – ahoura

回答

7

您需要的元素的引用传递给removeChild,而不是一个字符串:

body.removeChild(document.getElementById('verifying')); 

你也可以只隐藏:

document.getElementById('verifying').style.display = "none"; 
2

你removeChild之需要获得一个元素,而不是字符串

var body = document.body; 
var signup = document.getElementById("content-container"); 

setTimeout(function(){ 
    body.removeChild(document.getElementById('verifying')); 
    signup.style.display = "block"; 
}, 5000); 
1

删除你可以使用(如陈述)removeChild:

var x = document.getElementById('elementid'); 
x.parentNode.removeChild(x); 

,并隐藏元素:

var x = document.getElementById('elementid'); 
x.style.display="none"; 

编辑:

哦,如果你想隐藏它,但没有采取 “出流”,使用此:

var x = document.getElementById('elementid'); 
x.style.visibility="hidden";