javascript - 点击删除用JS制作的动态div

标签 javascript jquery html

我的代码知识非常有限,来自 CodeHS 和 Codecademy,所以请耐心等待。

所以我试图制作一个数字列表,可以通过单击删除。到目前为止,数字列表一切顺利,但我仍然不知道如何在单击 div 框时删除它们。

我知道有 JSFiddle,但我认为这是我能做的最好的: http://www.codecademy.com/rfabrega/codebits/xZ61aJ

<!DOCTYPE html>
<html>
<head> 
<meta name="viewport" content="width=203">
<title>Lista Mundial</title>

<style>
    .divContainer {
        width: 35px;
        height: 25px;
        border: solid 1px #c0c0c0;  
        background-color: #e1e1e1;
        font-family: verdana;  
        color: #000;
        float: left;
    }

    .text {
        font-size: 15px;
        font-family: verdana;
        color: black;
        margin-top: 4px;
    }

</style>
</head>
<body>
<script type="text/javascript">
    for(var i = 1; i <= 639; i++){
        var divTag = document.createElement("div");
        divTag.id = i;
        divTag.className = "divContainer";
        document.body.appendChild(divTag);
        var pTg = document.createElement("p");
        pTg.setAttribute("align", "center");
        pTg.className = "text";
        pTg.innerHTML = (i);
        document.getElementById(i).appendChild(pTg);
    }
</script>
</body>
</html>

最佳答案

您必须创建一个单击函数来删除目标 div 标签: 所以在你的代码中,创建 div 元素之后。插入这个:

divTag.onclick = function(){this.parentNode.removeChild(this)};

关于javascript - 点击删除用JS制作的动态div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22849837/

相关文章:

javascript - element.offset().top;在页面刷新过程中无法正常拉动滚动

javascript - 为什么 jQuery 的 .text() 无法识别\n?

html - Body overflow-y hidden 和 scroll inner div only

html - 如何在 CSS 规则中将图像的最大高度设置为父 div 的高度?

javascript - JS CSS 字体颜色和下划线

javascript - D3 : get the bounding box of a selected element

javascript - 200万以下所有质数的总和

javascript - 将数组展平为二维

python - Flask 中的速度优化

javascript - AngularJS Protractor : waiting for a service callback?