Javascript学习：案例2--动态创建元素（并且每一个新元素都带有相同的事件）

最新推荐文章于 2023-07-26 23:33:43 发布

酷jjs

最新推荐文章于 2023-07-26 23:33:43 发布

阅读量279

点赞数

分类专栏：前端笔记 Javascript

本文链接：https://blog.csdn.net/qq_32584661/article/details/80648196

版权

前端笔记同时被 2 个专栏收录

165 篇文章 2 订阅

订阅专栏

Javascript

40 篇文章 0 订阅

订阅专栏

js自学网站推荐：http://www.51zxw.net/study.asp?vip=4857021

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        input{
            margin:20px;
        }
    </style>
</head>
<body>

    <input type="button" id="Button1" value="测试" οnclick="addInput()">

    <hr>

    <script>
        var i =0;
        function addInput() {
            //使用dom创建元素的方法
            var o = document.createElement("input");
            o.type = "button";
            o.value = "button" + i++;

            //绑定事件
            o.addEventListener("click",addInput);

            document.body.appendChild(o);


            /*及时解除不再使用的变量引用，
             即将值赋值为null，
             有利于提高代码的运行效率
             */
            o = null;
        }

    </script>

</body>
</html>

效果图：

酷jjs

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Javascript学习：案例2--动态创建元素（并且每一个新元素都带有相同的事件）

&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Title&lt;/title&gt; &lt;style&gt; input{ margin:
复制链接

扫一扫

专栏目录