函数给出错误“div id”未定义。

Question

我有一个函数创建一个新的div与功能toArabic的输出。

function createListItem(value) { 

      var iDiv = document.createElement('div'); 
      iDiv.id = 'block'; 
      iDiv.className = 'block' + i; 
      var classString = iDiv.className.toString(); 
      document.getElementsByTagName('body')[0].appendChild(iDiv); 
      iDiv.innerHTML = toArabic(value).toString() + " " + "<span class='remove' onclick=' removeDummy(" + classString + "); '>x</span>"; 
      i++;  
} 

它创建一个Id块＃的div，所以第一个是block0，第二个是block1等等。

我想添加一个按钮“删除”，点击“x”将删除创建的div。我能够在removeDummy函数中提醒div名称，但它仍然给出了一个错误“block0 is nod defined”。

删除功能：

function removeDummy(value) { 

    var elem = document.getElementById(value); 
    elem.parentNode.removeChild(elem); 
    return false; 

} 

功能的工作，直到我给它的价值，但它会删除最早的股利，所以我决定给它一个div id来删除正是被cliked的一个。

什么可能导致此错误？为什么该功能可以使用警报，但不能删除？

我该如何解决这个问题？

在此先感谢！

Answer 1

夫妇的小错误：

第一：每div的创建具有相同的ID，但不同的类名。这应该颠倒过来。把id看作你的个人id，把class名称看成job。两个人不能有相同的ID，但他们可以有相同的工作。

iDiv.id = 'block' + i; 
iDiv.className = 'block'; 

二：目前，您的删除按钮看起来是这样：

<span class='remove' onclick=' removeDummy(block1); '>x</span> 

如果你点击它，然后它试图调用removeDummy，并将它传递变量block1。如果之前未定义block1，则它将包含具有相同想法的元素。您需要在封装这'值-s

"<span class='remove' onclick=' removeDummy('block" + i + "'); '>x</span>" 

Answer 2

是啊，你是不是增加元素的[id]

的[id]是唯一的页面上的一个元素，一个类名可以在多个共享元素

我更喜欢只使用document.querySelector()将#用于ID，或者将.用于className，或者如果您选择标记，则不适用。

Answer 3

更改：** iDiv。的setAttribute（ “ID”， “块”）; **

功能createListItem（值）{

 var iDiv = document.createElement('div'); 
     iDiv.setAttribute("id","block"); 
     iDiv.className = 'block' + i; 
     var classString = iDiv.className.toString(); 
     document.getElementsByTagName('body')[0].appendChild(iDiv); 
     iDiv.innerHTML = toArabic(value).toString() + " " + "<span class='remove' onclick=' removeDummy(" + classString + "); '>x</span>"; 
     i++;  

}

Answer 4

你所有的DIV ID的设置只是 “块” 尝试改变以下两行：

iDiv.id = 'block'; 
iDiv.className = 'block' + i; 

要这样：

iDiv.id = 'block' + i; 
iDiv.className = 'block';