首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

js动态添加div

问题 有没有遇到过这样需求, 在页面上会有不定个input, 点击添加按钮就添加 ?...点击第一行添加 点击时候, 将div准备好, 添加到内容div第一个 点击每行添加div添加到当前点击行后面一个 点击每行删除 删除当前div 实现 基本思路很简单, 只要在每个点击按钮上添加对应点击事件...我在封装时候喜欢先想用时候怎么用, 然后根据这个思路来想应该怎么封装, 思考如下 因为添加div肯定是不同, 是需要传参数, 但是如果直接传div字符串也太丑了, 应该在页面直接写HTML,...this.num = 0; } // 向内容div第一个添加 AddItem.prototype.addFistItem = function () { // 判断是否超出最大数量...this.addSuccessFunction(divItem, this.secp); // 序号迭代 this.secpIter(); // 条目+1 this.num++; }; // 向元素后面添加

24.4K40
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    原生js添加元素

    今天做页面使用mui,因为使用mui情况下无法使用jquery,于是在ajax请求完毕添加元素时候发现自己竟然对原生js添加元素方法有点模糊了,真是越活越倒退了,赶紧整理一波。...首先最简单innerHTML,这个不想多说,入门新手喜欢这么用,但他缺点也很明显:不管你渲染部分还是全部,始终需要替换原先所有的子元素,也就是需要重复渲染,会增加浏览器压力。...接下来就是正题了,js推荐是这样进行元素添加: 1.创建游离元素节点:let div=document.createElement(“div”); 2.给创建元素添加属性:div.setAttribute...(“class”,”className”);注意setAttribute一次只能设置一条属性 3.创建文本节点:let textNode=document.createTextNode(“需要添加文本...”); 4.将文本节点添加元素节点中div.appendChild(textNode); 5.加元素节点插入文档:Parent.appendChild(div); over 发布者:全栈程序员栈长,转载请注明出处

    8.9K20

    原生JS动态添加、删除元素&内容

    整理一下原生 js 添加及删除元素和内容相关知识,供参考。... 刀是我拿,人是我杀  一个容器,用来放添加元素。一个button按钮,用来动态操作DOM。...} 添加元素: 在元素添加内容: 文本内容 innerText container.innerText = '追加内容'; HTML内容 innerHTML container.innerHTML...H3标签'; 也可以用 += 写法: container.innerHTML += '追加内容为H3标签'; 创建元素及内容,添加到页面中: 创建元素 createElement...    {         div.removeChild(div.firstChild);     } } 原理很简单,就是不断判断要清空div还有没有子节点,有的话就删除一个子节点(这里是它首个子节点

    27.3K40

    JS向数组添加元素,插入数据

    大家好,又见面了,我是你们朋友全栈君。 js中对于数组操作很常见,下面记录一下js向数组添加元素方法。...=[11,22,33]; console.log('原数组:',myArray); myArray.push(44,55); console.log('用push在数组后面插入元素...:',myArray); myArray.unshift(66,77); console.log('用unshift在数组前面插入元素:',myArray); myArray.splice...(2,0,'肾虚少年'); console.log('用splice在数组指定位置插入元素:',myArray); 通过使用push以及unshift即可向数组插入元素,如果要在指定位置插入元素则可以用...splice,splice接收多个参数,分别是索引,要删除元素个数,新加元素(可多个,用逗号隔开); 这样即可向数组插入元素了。

    10.4K10

    js向数组指定位置添加元素

    规定从何处添加/删除元素。 该参数是开始插入和(或)删除数组元素下标,必须是数字。 howmany 必需。规定应该删除多少元素。必须是数字,但可以是 “0”。...要添加到数组元素 返回值 Type 描述 Array 如果从 arrayObject 中删除了元素,则返回是含有被删除元素数组。...二、JavaScript unshift() 方法 unshift 方法用于向数组开头添加一个或多个元素,并返回新数组长度。...要添加到数组元素序列,使用 , 分隔。 提示:unshift 方法将直接修改原数组,并将已经存在元素顺次地移到较高下标处,而不像其他很多方法一样得到一个原数组副本。...如果要进行 concat() 操作参数是数组,那么添加是数组中元素,而不是数组。

    8.4K50

    漫谈原生JS添加元素两种方法

    漫谈原生JS添加元素 常规方法 常规方法是首先创建一个目标元素并赋值给某个变量 ,但是元素里面内容较多,需要innerHTML赋值,将含有内容变量赋值给目标元素变量,最后,将这个目标元素变量通过appendChild...span = document.createElement("span"); li.appendChild(span); var element = document.querySelector(".div1...");//添加到指定位置 element.appendChild(lis); 便捷方法 可以直接用insertAdajcentHTML()将目标元素直接添加到指定位置。...此时添加目标元素直接用字符串形式赋值到变量中。最重要是注意引号变化,外单内双或外双内单。...字符串名) 插入位置可以选择以下属性值: beforebegin–>元素自身前面 afterbegin–>插入元素内部第一个子节点之前 beforeend–>插入元素内部最后一个子节点之后

    2.6K10
    领券