创建新的 HTML 元素
如需向 HTML DOM 添加新元素，您必须首先创建该元素（元素节点），然后向一个已存在的元素追加该元素。

实例1：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

    </head>

    <body>

        <div class="wrap" id="a">

            <input type="button"value="测试"  onclick="myf()"/>

        </div>

        <script type="text/javascript">

         function myf(){

             document.getElementById("a").appendChild(document.createElement("input"))//向已知元素节点a添加子元素input

         }

        </script>

    </body>

</html>

js---DOM元素节点的更多相关文章

  1. JavaScript HTML DOM 元素(节点)

    JavaScript HTML DOM 元素(节点) 创建新的 HTML 元素 创建新的 HTML 元素 如需向 HTML DOM 添加新元素,您必须首先创建该元素(元素节点),然后向一个已存在的元素 ...

  2. JavaScript HTML DOM元素节点常用操作接口

    在文档对象模型 (DOM) 中,每个节点都是一个对象.DOM 节点有三个重要的属性 : 1. nodeName : 节点的名称 2. nodeValue :节点的值 3. nodeType :节点的类 ...

  3. JS DOM创建节点

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

  4. DOM 元素节点几何量与滚动几何量

    当在 Web 浏览器中查看 HTML 文档时,DOM 节点被解析,并被渲染成盒模型(如下图),有时我们需要知道一些信息,比如盒模型的大小,盒模型在浏览器中的位置等等,本文我们就来详细了解下元素节点的几 ...

  5. JavaScript 要点（十四）HTML DOM 元素(节点)

    A.创建新的 HTML 元素 如需向 HTML DOM 添加新元素,必须首先创建该元素(元素节点),然后向一个已存在的元素追加该元素. <div id="div1"> ...

  6. 围绕DOM元素节点的增删改查

    HTML 文档中的所有内容都是节点: 整个文档是一个文档节点 document 每个 HTML 元素是元素节点 element HTML 元素内的文本是文本节点 每个 HTML 属性是属性节点 注释是 ...

  7. 获取 js DOM元素中绑定的所有事件,模仿 chrome getEventListeners

    偶尔看到了这个问题,如何用JS获取元素某一事件上绑定的所有Listener? 突然觉得好像是有解决办法的,查了下,在 chrome 下,支持 window.getEventListeners(obj) ...

  8. JS DOM元素的操作（创建，添加，删除，和修改属性）

    1.1 创建 DOM 元素以及相应的追加方式 1.1.1  创建:document.createElement('div'); 添加: fatherEle.appendChild(ele); appe ...

  9. JS DOM元素

    // 为element增加一个样式名为newClassName的新样式 function addClass(element, newClassName) { var value = element.c ...

  10. js DOM 元素ID就是全局变量

    有人在twitter上提到了:在Chrome的JavaScript终端中,你只需要输入一个元素的ID,就可以访问到这个元素.@johnjbarton给了解释,这是因为所有的元素ID都是全局变量.本文再 ...

随机推荐

  1. 如何在标题栏的title前添加网站logo

    之前在哪个网上看到的,今天没事给写下来了: 1.将像素大小为16*16的图片命名为 favicon.ico,(图片使用的颜色好像不能超过16色),放到网站根目录下就可以了; 2.在head标签中添加代 ...

  2. 700多个PHP版本随时切换，PHPWAMP共生模式与多档位综合教程。

    最近有学生向我咨询如何同时建立多个不同PHP版本站点,并自定义任意版本,软件是否可以多开,PHPWAMP如何设置才能与其他的环境同时使用等问题,本文将一一解决. 简单介绍一下PHPWAMP 你们应该会 ...

  3. 【CSS学习笔记】字体的控制

    关于font-family: "无衬线体"(Sans-serif),比如黑体,微软雅黑 "有衬线体"(Serif),比如宋体,新宋 程序员设置的字体,客户电脑上 ...

  4. centos jdk 安装

    1)下载JDK 1.7(1.7.0_25) 下载地址为: http://www.Oracle.com/technetwork/java/javase/downloads/jdk7-downloads- ...

  5. 负载均衡,最理想使用 redis实现session共享

    负载均衡在多台php服务器负载均衡的情况下,第一秒请求是a服务器,第二秒请求是b服务器, session必须放在一个公共的服务器,最理想是使用 redis实现session共享.内存的速度比磁盘访问快 ...

  6. POJ 2484 A Funny Game

    博弈. $n>=3$,后手赢,否则先手赢. #pragma comment(linker, "/STACK:1024000000,1024000000") #include& ...

  7. CodeForces 706B Interesting drink

    排序,二分. 将$x$数组从小到大排序,每次询问的时候只要二分一下位置就可以了. #pragma comment(linker, "/STACK:1024000000,1024000000& ...

  8. Android_AndroidStudio配置

    IDE降低了程序编译的门槛, 让Android程序的编译和运行变得简单易操作. 但无论Eclipse还是Android Studio, IDE都不是非常智能和可靠的, 总会出大大小小的问题. 很多时候 ...

  9. Hadoop无法上传文件查找原因

    部署了集群,上传测试文件到HDFS文件系统的时候出现问题.could only be replicated to 0 nodes, instead of 1,如下图所示: 度娘寻找解决方案: 博客链接 ...

  10. Android数据库--Sqlcipher的使用（一）

    1.下载官方支持包:https://s3.amazonaws.com/sqlcipher/3.2.0/sqlcipher-for-android-community-v3.2.0.zip Github ...