创建一个元素

createElement()

向元素末尾添加一个子节点

appendChild()

将新的元素插入到指定元素的前面

insertBefore(new,old);

删除一个子节点

removeChild() //接收一个节点类型的;参数是要删除的这个元素;

替换子节点

replaceChild(new,old); //用新的元素替换原有的元素

克隆元素

cloneChild()
//接收一个布尔类型的参数 true,false
//如果不传参数,默认是false;
console.log(box.cloneNode(true)); //浅克隆
a.appendChild(box.cloneNode(true))//深克隆

js动态操作DOM的更多相关文章

  1. 【原生js】js动态添加dom,如何绑定事件

    首先要明白浏览器在加载页面的时候是按顺序来加载的,这样以来就很清楚了,js动态添加dom以后,这些dom并没有绑定事件,这个时候最简单的一个办法就是:将绑定事件的方法封装到一个函数A中,在动态添加完d ...

  2. JS/JQuery操作DOM元素笔记

    原因 自己目前在搭建一个.NET Core的框架,正在构建权限这块的东西,今天设置权限界面,需要使用JavaScript操作DOM元素,记录一下. 页面大概是酱紫的(我使用的AdminLTE和LayU ...

  3. 解决js动态改变dom元素属性后页面及时渲染问题

    今天实现一个进度条加载过程,dom结构其实就是两个div <div class="pbar"> <div class="ui-widget-header ...

  4. Js动态操作表格

    HTML <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" co ...

  5. 使用JS动态操作css的集中方法

    内联样式 在咱们深入一些复杂的知识之前,先回来顾一下一些基础知识.例如,咱们可以通过修改它的.style属性来编辑给定的HTMLElement的内联样式. const el = document.cr ...

  6. 原生js动态改变dom高度

    item参数为要改变高度的dom,maxHight参数为dom的最大高度,speed参数为改变高度的速度function addHeight(item,maxHight,speed){ var ite ...

  7. js动态操作订单表格

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. js 动态操作元素

    <!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...

  9. JavaScript操作DOM对象

    js的精华即是操作DOM对象 [1]先看代码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8& ...

随机推荐

  1. [转帖]linux 内存管理——内核的shmall 和shmmax 参数

    (转)linux 内存管理——内核的shmall 和shmmax 参数   内核的 shmall 和 shmmax 参数 SHMMAX= 配置了最大的内存segment的大小 ------>这个 ...

  2. ubuntu安装网易云音乐

    1直接安装sudo dpkg -i netease-cloud-music_1.0.0_i386_ubuntu16.04.deb 2修复并自动安装所有依赖包 sudo apt-get install ...

  3. php常用扩展安装

    ####memcache wget http://pecl.php.net/get/memcache-2.2.7.tgztar xf memcache-2.2.7.tgz cd memcache-2. ...

  4. springMVC 使用WebApplicationContext获取ApplicationContext对象

    主要用于从application中获取bean 1.applicationContext 在web.xml中使用listener配置 <context-param> <param-n ...

  5. jmeter 创建web测试计划

    测试用例: 1 创建5个用户发送请求到2个web页面: 2 发送3次请求 总请求=5*2*3=30 创建这个测试计划需要用到以下元素:thread groups / http request / ht ...

  6. git常用命令及用法小计

    git init 初始化一个本地git仓库repository git status 查看状态 git add <file> 将工作区修改加到暂存区(stage) git commit - ...

  7. React的组件间通信

    一.React的单向数据流 React是单向数据流,数据主要从父节点传递到子节点(通过props).如果顶层(父级)的某个props改变了,React会重渲染所有的子节点.这通常被称为“自顶向下”或“ ...

  8. lvs逻辑卷详解

    管理磁盘空间对系统管理员来说是一件重要的日常工作.一旦磁盘空间耗尽就需要进行一系列耗时而又复杂的任务,以提升磁盘分区中可用的磁盘空间.它也需要系统离线才能处理.通常这种任务会涉及到安装一个新的硬盘.引 ...

  9. BZOJ1222[HNOI2001]产品加工——DP

    题目描述 某加工厂有A.B两台机器,来加工的产品可以由其中任何一台机器完成,或者两台机器共同完成.由于受到机器性能和产品特性的限制,不同的机器加工同一产品所需的时间会不同,若同时由两台机器共同进行加工 ...

  10. BZOJ2049[Sdoi2008]洞穴勘测——LCT

    题目描述 辉辉热衷于洞穴勘测.某天,他按照地图来到了一片被标记为JSZX的洞穴群地区.经过初步勘测,辉辉发现这片区域由n个洞穴(分别编号为1到n)以及若干通道组成,并且每条通道连接了恰好两个洞穴.假如 ...