当前位置: 首页 > Web前端 > HTML

百度前端学院小斌学院任务四

时间:2023-04-02 17:29:55 HTML

左输入右输入左出右出

<脚本>varleftInBtn=document.querySelector("#left-in");varrightInBtn=document.querySelector("#right-in");varleftOutBtn=document.querySelector("#left-out");varrightOutBtn=document.querySelector("#right-out");varcontainer=document.querySelector("#container");varinput=document.querySelector("#input");变量值=输入值;varchildren=container.children;input.addEventListener("改变",function(){value=input.value;});leftInBtn.addEventListener("click",function(){container.insertAdjacentHTML("afterBegin",`${value}`);});rightInBtn.addEventListener("click",function(){container.insertAdjacentHTML("beforeEnd",`${value}`);});leftOutBtn.addEventListener("click",function(){container.removeChild(children[0]);});rightOutBtn.addEventListener("click",function(){container.removeChild(children[children.length-1]);});container.addEventListener("click",function(e){vartarget=e.target;container.removeChild(target);})

最新推荐
猜你喜欢