javascript 动态创建元素appendChild,并加入删除操作removeChild

最新推荐文章于 2023-07-20 10:11:30 发布

戴宇琪

最新推荐文章于 2023-07-20 10:11:30 发布

阅读量2.5k

点赞数

分类专栏： WEB前端开发

本文链接：https://blog.csdn.net/yuqidai/article/details/51612584

版权

WEB前端开发专栏收录该内容

48 篇文章 0 订阅

订阅专栏

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>javascript 动态创建元素appendChild,并加入删除操作removeChild</title>
<script>
window.onload = function(){
    var oInp = document.getElementsByTagName('input');
    var oUl = document.getElementById('ul1');
    
    oInp[1].onclick = function(){
        
        var oLi = document.createElement('li'); 
        var oA = document.createElement('a');   
        
        oA.http = 'javascript:;';
        oA.innerHTML = '删除';
        
        oA.onclick = function(){
            oUl.removeChild(this.parentNode);
            }
            
        oLi.innerHTML = oInp[0].value;
        oLi.appendChild(oA);
        oUl.appendChild(oLi);
        }
    }
</script>
</head>
<body>
<input type="text" /> <input type="button" value="留言"  />
<ul id="ul1"></ul>
</body>
</html>

戴宇琪

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
javascript 动态创建元素appendChild,并加入删除操作removeChild

javascript 动态创建元素appendChild,并加入删除操作removeChildwindow.onload = function(){ var oInp = document.getElementsByTagName('input'); var oUl = document.getElementById('ul1'); oInp[1].oncli
复制链接

扫一扫