我需要创建和删除html元素,但删除功能不起作用。
<script>
function addElement() {
var ni = document.getElementById('myDiv');
var numi = document.getElementById('theValue');
var num = (document.getElementById('theValue').value -1)+ 2;
numi.value = num;
var newdiv = document.createElement('div');
var divIdName = 'my'+num+'Div';
newdiv.setAttribute('id',divIdName);
newdiv.innerHTML = 'Element Number '+num+' has been added! <a href="#\" onclick="removeElement('+divIdName+')">Remove the div '+divIdName+' </a>';
ni.appendChild(newdiv);
}
function removeElement(divNum) {
var d = document.getElementById('myDiv');
var olddiv = document.getElementById(divNum);
d.removeChild(olddiv);
}
</script>
<input type="hidden" value="0" id="theValue" />
<p><a href="javascript:;" onclick="addElement();">Add Some Elements</a></p>
<div id="myDiv"> </div>
我真的试过了。
答案 0 :(得分:1)
你必须将参数包装在引号中,因为它是一个字符串。
newdiv.innerHTML = 'Element Number '+num+' has been added! <a href=\"#\" onclick="removeElement(\''+divIdName+'\')">Remove the div '+divIdName+' </a>';
以下是工作代码段
function addElement() {
var ni = document.getElementById('myDiv');
var numi = document.getElementById('theValue');
var num = (document.getElementById('theValue').value -1)+ 2;
numi.value = num;
var newdiv = document.createElement('div');
var divIdName = 'my'+num+'Div';
newdiv.setAttribute('id',divIdName);
newdiv.innerHTML = 'Element Number '+num+' has been added! <a href=\"#\" onclick="removeElement(\''+divIdName+'\')">Remove the div '+divIdName+' </a>';
ni.appendChild(newdiv);
}
function removeElement(divNum) {
var d = document.getElementById('myDiv');
var olddiv = document.getElementById(divNum);
d.removeChild(olddiv);
}
<input type="hidden" value="0" id="theValue" />
<p><a href="javascript:;" onclick="addElement();">Add Some Elements</a></p>
<div id="myDiv"> </div>