在javascript中添加和刪除div中的div

我對JavaScript很陌生，可能還有其他人已經問過類似的問題，但我希望你能幫助我。我正在嘗試添加/刪除div的簡單基本操作。添加工作正常，刪除永遠不會被調用。在javascript中添加和刪除div中的div

function $(el) { 
    return document.getElementById(el); 
} 

function remove() { 
    console.log("remove called"); 
    var child = $('second'); 
} 

function addContainer() { 
    console.log("addContainer called"); 
    var aContainer = document.createElement('div'); 
    aContainer.setAttribute('id', 'second'); 
    aContainer.innerHTML = "<a href=\"#\" onclick=\"remove()\">second</a>"; 
    document.body.appendChild(aContainer); 
}

在addContainer中我嘗試添加onclick函數回調，但顯然它不起作用。

這裏參考的jsfiddle http://jsfiddle.net/m8kyav2b/

你知道爲什麼 1- remove函數不會被調用？ 2-一旦我點擊刪除鏈接，innerHTML被刪除，但不是div「秒」？

感謝很多提前

來源

2014-11-22 CKY

'$（ '第二個'）'是一個jQuery選擇沒有jQuery是目前 – 2014-11-22 03:21:14

@Xero - 它不是一個jQuery選擇 – 2014-11-22 03:22:22

我在定義的函數$（EL）。我在其他腳本中使用了相同的功能，從來沒有遇到過問題，定義有沒有問題？編輯：@Xero：別擔心:) – CKY 2014-11-22 03:24:45

試試這個樣子，這將工作：

DEMO

function $(el) { 
    return document.getElementById(el); 
} 

function removeit() { 
    alert("remove called"); 
    var child = $('second'); 
    child.remove(); 


} 

function addContainer() { 
    console.log("addContainer called"); 
    var aContainer = document.createElement('div'); 
    aContainer.setAttribute('id', 'second'); 
    aContainer.innerHTML = "<a href=\"#\" onclick=\"removeit()\">second</a>"; 
    document.body.appendChild(aContainer); 
}

旁註：

調用remove（）作爲你的函數不會因爲它是一個原生的JavaScript功能。您實際上並沒有刪除函數中的div！

來源

2014-11-22 03:25:44 baao

嗯，我注意到一個點亮如果你點擊「秒」，它會消失，然後你點擊「移動」，它會再次出現，但是你不能再次隱藏它。 – 2014-11-22 03:30:21

@Xero你嘗試過嗎？ http://jsfiddle.net/m8kyav2b/5/每次都爲我工作 – baao 2014-11-22 03:31:43

呵呵，你的回答指向錯誤小提琴然後，：P – 2014-11-22 03:32:58

remove不會被調用，因爲remove在<a>標籤指的是本機的功能remove（具體而言，HTMLAnchorElement.prototype.remove/ChildNode.remove），而不是你的。這就是爲什麼只有文字被刪除，因爲ChildNode.remove的目標是其子女。

要引用您的功能，請

<a href="#" onclick="window.remove();"></a>

甚至更好：

var aContainer = document.createElement('div'), 
    anchor = document.createElement("a"); 
aContainer.setAttribute('id', 'second'); 
a.innerText = "second"; 
a.addEventListener("click", remove); 
aContainer.appendChild(a); 
document.body.appendChild(aContainer);

來源

2014-11-22 03:26:10

感謝提示:) – CKY 2014-11-22 03:32:45

這裏是一個有用的鏈接：Remove element by id。就在下面的代碼進行測試和工程（它會在鼠標移到刪除HTML標籤，所以基本上只是改變周圍的一點點的語法把它刪除什麼都標記你想要的。

<p id="el" onmouseover="remove()">test</p> <!--we are deleting with JavaScript this HTML <p> tag. --> 

function remove() { 
    var element = document.getElementById("el"); /* finding and assigning element to variable element */ 
    document 
    element.parentNode.removeChild(el); // then deleting the parent and child (please refer to link) 
}

爲其餘。你的問題看這裏：add onclick event to newly added element in javascript

來源

2014-11-22 03:46:30 Kris

在javascript中添加和刪除div中的div

回答

相關問題