<!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">

    <title>create系列创建节点的方法</title>

    <!--

        document.createElement("元素a");创建元素节点a

        document.createTextNode("文本a");创建文本节点a

        document.createDocumentFragment();创建文档片段

        document.createComment("注释a");创建注释a

        a.appendChild(b);使b作为子节点附加在a节点上

        扩展知识：父元素a.insertBefore(节点b,节点c);

                解读：将节点b插入节点a内节点c的前面

     -->

</head>

<body>

    <ul id="ul1"></ul>

    <script>

        var ul=document.getElementById("ul1");//获取无序列表

        var li=document.createElement("li");//创建列表项

        var text=document.createTextNode("text");//创建文本

        var fragment=document.createDocumentFragment();//创建文档片段

        var comment=document.createComment("js 中创建的注释");//创建注释

        li.appendChild(text);//将文本附加给列表项

        fragment.appendChild(li);//将列表项附加给文档片段

        ul.appendChild(fragment);//将文档碎片附加给无序列表

        document.body.insertBefore(comment,document.body.firstChild);//将创建的注释安插在body的第一行

    </script>

</body>

</html>

create系列创建节点的方法的更多相关文章

  1. JS DOM创建节点

    DOM节点操作之增删改查 document.write() 可以向文档中添加节点 但是有个致命问题,会把文档原有的节点全部清空 因此不推荐使用 <!DOCTYPE html> <ht ...

  2. 创建节点--DOM树

    创建节点 快捷键:innerhtml outerhtml innertext outertext ==============创建节点方法有两种:============== <script s ...

  3. JQuery_DOM 节点操作之创建节点、插入节点

    一.创建节点 为了使页面更加智能化,有时我们想动态的在html 结构页面添加一个元素标签,那么在插入之前首先要做的动作就是:创建节点 <script type="text/javasc ...

  4. Zookeeper命令行操作(常用命令；客户端连接；查看znode路径；创建节点；获取znode数据，查看节点内容，设置节点内容，删除节点；监听znode事件；telnet连接zookeeper)

    8.1.常用命令 启动ZK服务 bin/zkServer.sh start 查看ZK服务状态 bin/zkServer.sh status 停止ZK服务 bin/zkServer.sh stop 重启 ...

  5. js···DOM2动态创建节点

    1.生成节点的方法  document.createElement(“div”) 2.插入节点的方法   父元素.appendChild(新节点) 在父节点中的子节点后面插入新的节点 3.在指定的位置 ...

  6. 11-15 dom 动态创建节点

    1.生成节点的方法  document.createElement(“div”) 2.插入节点的方法   父元素.appendChild(新节点) 在父节点中的子节点后面插入新的节点 3.在指定的位置 ...

  7. jQuery操作DOM节点的方法总结

    1.parent():获得当前匹配元素集合中每个元素的父元素,该方法只会向上一级对 DOM 树进行遍历 $('li.item-a').parent().css('background-color', ...

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

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

  9. 关于document的节点；用Dom2创建节点；

    一.关于节点 1.节点树状图 document>documentElement>body>tagName 2.节点类型 元素节点(标签).文本节点(文本).属性节点(标签属性) 3. ...

随机推荐

  1. Django开发之module

    1.首先需要安装你要使用的数据的python模块组件 2.需要新建一个app 切换到工程根目录下,然后执行django-admin.py startpapp firstModule 编辑first/s ...

  2. 【题解】Luogu P5340 [TJOI2019]大中锋的游乐场

    原题传送门 没想到省选也会出这种题??! 实际就是一个带有限制的最短路 因为\(k<=10\),所以我们珂以暴力将每个点的权值分为[-k,k],为了方便我们珂以转化成[0,2k],将汉堡的权值记 ...

  3. golang --Converting and Checking Types

    package main import ( "fmt" "strconv" ) func main() { strVar := "100" ...

  4. Huber Loss 介绍

    Huber Loss 是一个用于回归问题的带参损失函数, 优点是能增强平方误差损失函数(MSE, mean square error)对离群点的鲁棒性. 当预测偏差小于 δ 时,它采用平方误差,当预测 ...

  5. MVC视图中 TextBoxFor 数据格式化

    @Html.TextBoxFor(m => m.Birthday,"{0:yyyy-MM-dd}", new { @class = "m-wrap small&qu ...

  6. 2019 同程旅游java面试笔试题 （含面试题解析）

      本人5年开发经验.18年年底开始跑路找工作,在互联网寒冬下成功拿到阿里巴巴.今日头条.同程等公司offer,岗位是Java后端开发,因为发展原因最终选择去了同程,入职一年时间了,之前面试了很多家公 ...

  7. python中的{字典}

    目录 字典--dict { } 字典是无序,可变的数据类型. 字典:用于存储数据,存储大量数据,字典要比列表快:将数据和数据之间进行关联. 定义: dic = {键:值,键:值} #每个 键值对 以逗 ...

  8. 【转载】使用宝塔对Linux系统进行界面化管理操作

    腾讯云服务器和阿里云服务器的Centos系统都是没有Linux系统的一个版本,Centos系统的操作都是在没有类似Windows图形化操作界面的黑框框命令窗口进行操作的,需要使用到很多Linux操作命 ...

  9. cs/bs架构的区别

    Client/Server是建立在局域网的基础上的,基于客户端/服务器,安全,响应快,维护难度大,不易拓展,用户面固定,需要相同的操作系统. Browser/Server是建立在广域网的基础上的,基于 ...

  10. Pod和Namespace的基本介绍

    namespace资源名称空间 删除namespace资源会级联删除其所包含的所有其它资源对象    名称空间仅仅只是用来限制资源名称的作用域      并不能实现Pod的通信隔离 在名称空间下操作s ...