复制狗狗添加狗狗

最新推荐文章于 2024-04-25 20:39:28 发布

大海知天空

最新推荐文章于 2024-04-25 20:39:28 发布

阅读量650

点赞数

本文链接：https://blog.csdn.net/weixin_42044486/article/details/84026912

版权

<!DOCTYPE html>
<html lang="zh">
<head>
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <meta http-equiv="X-UA-Compatible" content="ie=edge" />
   <title>Document</title>

<script>
       function copyImg(){
           var dog = document.getElementById("img1");
           var copyDog = dog.cloneNode(false);
           document.body.appendChild(copyDog);
       }
       function addImg(){
           var dog1 = document.getElementById("img1");
           var addDog = document.createElement("img");
           addDog.setAttribute("src","img/banner4.jpg");
           addDog.setAttribute("alt","可爱的狗狗");
           addDog.setAttribute("border","1");
           /*addDog.setAttribute("width","200px");
           addDog.setAttribute("height","200px");*/
           addDog.width=200;
           addDog.height=100;
           document.body.insertBefore(addDog,dog1);
       }
   </script>
</head>
<body>
   <h2>创建并插入节点</h2>
   <input id="copyBtn" type="button" value="复制狗狗" οnclick="copyImg()" />
   <input id="addBtn" type="button" value="增加狗狗" οnclick="addImg()"/><br />
   <img id="img1" src="img/banner3.jpg" border="1" alt="可爱的狗狗"/>
</body>
</html>