dddinosaur 2022-07-05 22:18 采纳率: 100%
浏览 34
已结题

js中重复点击添加按钮添加多个元素，删除按钮函数怎么写？

<body>
  <div>
    <button type="button" onclick="add()">添加图片</button>
    <button type="button" onclick="del()">删除图片</button>
  </div>
  <div id='stage'>
    
  </div>
  <script type="text/javascript">
    var pic;
    function add(){
      pic = document.createElement("img");
      pic.src = "F:\enjoy\doge.png";   
      var stage = document.getElementById("stage");
      stage.appendChild(pic);       
    }
    function del(){
      var stage = document.getElementById("stage");
      stage.removeChild(pic);
    }
  </script>
</body>
  • 写回答

2条回答 默认 最新

  • 天际的海浪 2022-07-05 22:41
    关注

    你题目的解答代码如下：

    <!doctype html>
<html lang="en">
<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,chrome=1" />
    <title> 页面名称 </title>
</head>

<body>
  <div>
    <button type="button" onclick="add()">添加图片</button>
    <button type="button" onclick="del()">删除图片</button>
  </div>
  <div id='stage'>
    
  </div>
  <script type="text/javascript">
    var pic;
    function add(){
      pic = document.createElement("img");
      pic.src = "F:\enjoy\doge.png";   
      var stage = document.getElementById("stage");
      stage.appendChild(pic);       
    }
    function del(){
      var stage = document.getElementById("stage");
      stage.removeChild(stage.lastElementChild);
    }
  </script>
</body>

</html>

    如有帮助，请点击我的回答下方的【采纳该答案】按钮帮忙采纳下，谢谢!

    img

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(1条)

报告相同问题？

  • html语言添加点击事件,在JavaScript中如何添加点击事件？
    2021-06-09 04:20
    weixin_39877166的博客 事件就是用户或者浏览器自身执行的某种动作。诸如click、load和mouseover，都是事件的名字。...JavaScript中添加点击事件的方法：一：HTML中添加onclick哈哈二：JS中定义函数绑定事件var funcc = fun...
  • javascript 一个函数对同一元素的多个事件响应
    2020-10-29 19:43
    总结来说，JavaScript中的事件处理可以灵活地在一个函数中处理多个事件，或者通过`addEventListener`来单独处理每个事件，根据项目需求和个人编程风格选择合适的方法。理解并熟练运用这些技巧，能帮助开发者创建更...
  • JavaScript实现点击单选按钮改变输入框中文本域内容的方法
    2020-10-23 19:15
    首先，单选按钮是表单中常见的一种输入类型，通常用于从多个选项中选择一个。在文档中，单选按钮被用作触发器，点击不同的单选按钮，页面上将显示不同的内容。这是基于单选按钮的name属性是相同的，这样在提交表单时...
  • JavaScript使用push方法添加一个元素到数组末尾用法实例
    2020-10-24 10:33
    然后，创建了一个按钮，当用户点击这个按钮时，会触发名为`myFunction`的JavaScript函数。 ```javascript var fruits = ["Banana", "Orange", "Apple", "Mango"]; ``` 在`myFunction`函数内部，`push()`方法被用来...
  • jQuery使用append在html元素后同时添加多项内容的方法
    2020-10-24 11:53
    这个示例中，按钮的点击事件触发`appendText`函数，当用户点击按钮时，新的段落将被添加到页面底部。 总结一下，使用jQuery的`append()`方法在HTML元素后同时添加多项内容的关键在于： 1. 创建要添加的内容，可以是...
  • window.addEventListener来解决让一个js事件执行多个函数
    2020-10-27 19:14
    在JavaScript编程中，经常需要处理各种用户交互事件，如点击、加载等。当需要一个事件触发时执行多个函数，单纯地使用`window.onload`或元素的`onclick`等事件处理方式可能会遇到问题，特别是在需要同时处理多个事件...
  • Javascript点击按钮随机改变数字与其颜色
    2020-10-21 15:17
    3. 事件监听与处理：在JavaScript中，使用`onclick`事件处理器来添加对按钮点击事件的监听，当按钮被点击时，触发定义的函数执行。这体现了事件驱动编程的思想。 4. 随机数生成：利用`Math.random()`函数生成一个0...
  • 函数式JavaScript编程指南
    2020-12-01 10:54
    写这篇指南的目的是因为关于JavaScript编程的资料太多了但是极少的资料提到了JavaScript的函数式特性。在本指南中，我只会讲解这些基本知识而不会深入其它的函数式语言或这是Lambda算子。 你可以点击所有的例子...
  • JS点击按钮图片随机排列特效代码
    2021-03-20 04:08
    在JavaScript（JS）编程中，实现点击按钮图片随机排列的特效是一种常见的动态效果，它可以为网页增添互动性和趣味性。这种特效通常应用于个人影集、照片墙或者展示类的网页，让用户每次刷新或点击按钮时，图片都能...
  • JavaScript中5种调用函数的方法
    2020-12-03 21:18
    一次又一次的,我发现,那些有bug的Javascript代码是由于没有真正理解Javascript函数是如何工作而导致的(顺便说一下,许多那样的代码是我写的).JavaScript拥有函数式编程的特性, 当我们选择面对它的时候,这将成为我们...
  • 没有解决我的问题, 去提问

问题事件

  • 系统已结题 7月13日
  • 已采纳回答 7月5日
  • 创建了问题 7月5日