createElement(tabName) 创建一个为tagName的新元素节点

ANode.appendChild(BNode)把B节点追加至A节点的末尾

insertBefore(ANode,BNode)把A节点插入到B节点之前

Node.cloneNode(deep)：deep为true则复制该节点以及该节点的所有子节点，为false则只复制该节点和其属性

Node.removeChild(删除指定的子节点名称)

Node.replaceChild(new_Node,old_Node)：新的替换旧的

例如：

<script>
onload=function(){
　　var h1=document.createElement("H1");        //创建一个为H1的新元素节点
　　var h2=document.createElement("H2")
　　h1.innerHTML="诗和远方";     //传入值
　　h2.innerHTML="美丽的地方";
　　var body1=document.getElementsByTagName("body")[0];       //获得body标签对象
　　body1.appendChild(h1);       //给body标签追加标签
　　body1.insertBefore(h2,h1);       //将h2标签插入h1标签之前
　　var a=h1.cloneNode(true);       //将h1标签的文本标签一同拷贝，用true，默认是false
　　body1.appendChild(a)    
}
</script>

<body>
</body>

javascript 创建节点和新增节点的更多相关文章

  1. javascript创建文档碎片节点

    在<javascript高级程序设计>一书的6.3.5:创建和操作节点一节中,介绍了几种动态创建html节点的方法,其中有以下几种常见方法: · crateAttribute(name): ...

  2. k8s节点简介、移除节点、新增节点

    简介 Node是Pod真正运行的主机,可以是物理机也可以是虚拟机. Node本质上不是Kubernetes来创建的, Kubernetes只是管理Node上的资源. 为了管理Pod,每个Node节点上 ...

  3. javascript之DOM编程设置节点插入节点

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

  4. redis 集群新增节点，slots槽分配，删除节点， [ERR] Calling MIGRATE ERR Syntax error, try CLIENT (LIST | KILL | GET...

    redis reshard 重新分槽(slots) https://github.com/antirez/redis/issues/5029 redis 官方已确认该bug redis 集群重新(re ...

  5. kubernetes 集群新增node 节点并将应用分配到新增节点

    第一章 1.重新安装一台kubernetes node节点,新增节点:192.168.1.192 网址:https://www.cnblogs.com/zoulixiang/p/9504324.htm ...

  6. javascript创建节点的事件绑定

    javascript创建节点的事件绑定 timeupdate事件是<video>中用来返回视频播放进度的事件,绑定在<video>标签返回视频播放位置(每秒计). 现video ...

  7. JavaScript函数使用和DOM节点

    一.函数的声明与调用 1.函数声明的格式: function 函数名(参数1, 参数2,....){ 函数体代码 return 返回值:} 2.函数的调用:①直接调用:函数名(参数1的值,参数2的值, ...

  8. 解决jQuery ajax动态新增节点无法触发点击事件的问题

    在写ajax加载数据的时候发现,后面添加进来的demo节点元素,失去了之前的点击事件.为什么点击事件失效,我们该怎么去解决呢? 其实最简单的方法就是直接在标签中写onclick="" ...

  9. 【笔记】科普createDocumentFragment() 创建文档碎片节点

    上一篇文章说到了动态添加文本节点的方法那如果我们要添加多个文本节点或者元素节点呢? 大家可能会想到用循环然后逐个逐个添加 但是别忘了js 还提供了创建一个文本碎片的方法 createDocumentF ...

随机推荐

  1. 在状态栏增加图标（Android 6.0）

    在Android 启动之后,在SystemServer.java的run方法中,调用了StatusBarManagerService的构造方法,在StatusBarManagerService的构造方 ...

  2. io复用select方法编写的服务器

    摘要:io多路复用是通过一种机制,可以监视多个描述符,一旦某个描述符就绪(一般都是读就绪或者写就绪),就能通知应用程序进行相应的读写操作.select函数作为io多路复用的机制,第一个参数nfds是f ...

  3. js之 单例模式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. Problem A: STL——灵活的线性表

    Description 数组和链表是我们熟知的两种线性结构,但是它们不够灵活(不能同时实现直接插入.删除和访问操作),给你若干种操作,你能通过一种灵活的容器,实现它们的功能吗? 操作1:Build a ...

  5. JS 返回上一页并刷新代码整理

    一:JS 重载页面,本地刷新,返回上一页: <a href="javascript:history.go(-1)">返回上一页</a> <a href ...

  6. 对于一个段错误（核心已转储）问题的解答，错误的英文翻译是segment fault(core dumped)

    笔者在学习ROS的时候遇到的这个问题,使用的系统是ubuntu16.04,ROS版本是kinetic,在运行小海龟程序的时候突然打不开海龟界面的程序节点turtlesim-node,四处寻找答案未果, ...

  7. 字符串a-b

    #include<iostream> #include<stdio.h> #include<algorithm> #include<cmath> #in ...

  8. mysql_pconnect 问题

    不同于mysql_connect的短连接,mysql_pconnect持久连接的时候,将先尝试寻找一个在同一个主机上用同样的用户名和密码已经打开的(持久)连接,如果找到,则返回此连接标识而不打开新连接 ...

  9. WeX5学习笔记 - 01

    了解WeX5,有朋友突然自己开始学习WeX5,我了解后觉得挺不错的实用范围广,现在手机上的主流软件基本都可以采用WeX5进行开发,如淘宝,美团.手机银行等,所以自己也开始学习WeX5,WeX5是Ecl ...

  10. php导出excel问题之解决

    phpExcel采用的版本:1.8.1.0   git地址:https://github.com/PHPOffice/PHPExcel.git 在windows7+nginx的环境中,选择Excel5 ...