試圖用Javascript刪除元素

Question

當客戶點擊「購買」按鈕時，我在屏幕上創建一個允許他們填寫購買表單的彈出窗口。在poput上我想要一個「x」按鈕，這樣他們可以關閉它並返回到主網站。

我運行生成彈出的代碼是：

var o = document.createElement('div'); 
o.className = 'overlay'; 

var p = document.createElement('div'); 
p.className = 'buyticketid'; 
p.setAttribute('id','buy-ticket'); 

var cb = document.createElement('p'); 
cb.className = 'closeButton'; 
cb.setAttribute('onclick','close()'); 
cb.setAttribute('title','Close'); 
cb.setAttribute('id','close-btn'); 
var x = document.createTextNode('x'); 
cb.appendChild(x); 

p.appendChild(cb); 

document.getElementsByTagName('body')[0].appendChild(o); 
document.getElementsByTagName('body')[0].appendChild(p); 

我用它來嘗試和刪除彈出的代碼（ID =「購買門票」）是：

function close(){ 

var element = document.getElementById("buy-ticket"); 
element.parentNode.removeChild(element); 

} 

對於當我點擊關閉按鈕時沒有任何反應。如果任何人都可以指出我的方向是正確的，那就太棒了。

Answer 1

您可以點擊處理程序分配給這樣的DOM元素：element.onclick = callback;其中回調是你的回調函數。

可正常工作：

function close(){ 
    var element = document.getElementById("buy-ticket"); 
    element.parentNode.removeChild(element); 
} 

var o = document.createElement('div'); 
o.className = 'overlay'; 

var p = document.createElement('div'); 
p.className = 'buyticketid'; 
p.setAttribute('id','buy-ticket'); 

var cb = document.createElement('p'); 
cb.className = 'closeButton'; 
cb.onclick = close; 
cb.setAttribute('title','Close'); 
cb.setAttribute('id','close-btn'); 
var x = document.createTextNode('x'); 
cb.appendChild(x); 

p.appendChild(cb); 

document.getElementsByTagName('body')[0].appendChild(o); 
document.getElementsByTagName('body')[0].appendChild(p);