创建新的 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. MongoDB应用案例：使用 MongoDB 存储日志数据

    线上运行的服务会产生大量的运行及访问日志,日志里会包含一些错误.警告.及用户行为等信息,通常服务会以文本的形式记录日志信息,这样可读性强,方便于日常定位问题,但当产生大量的日志之后,要想从大量日志里挖 ...

  2. 集中式（CVS、SVN）VS分布式（Git）

    集中式版本控制系统,版本库是集中存放在中央服务器的,而干活的时候,用的都是自己的电脑,所以要先从中央服务器取得最新的版本,然后开始干活,干完活了,再把自己的活推送给中央服务器.中央服务器就好比是一个图 ...

  3. LIst去重，重写方法，继承接口。

    调用: ]).ToList(); var dic = dataThis.Distinct( new repDic()).ToList();var repList = ""; for ...

  4. 开子线程下载图片,回到主线程刷新UI步骤

    -(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event { [NSThread detachN ...

  5. mysql的部分基础知识....

  6. nohup及/dev/null使用

    1.nohup    ----后台执行,执行记录默认输出到当前目录下的nohup.out文件         nohup find /etc -name passwd 2./dev/null介绍 把/ ...

  7. 获取URL中的参数值

    //获取url中ID的值function getParamByName(name, url) { var match = RegExp('[?&]' + name + '=([^&]* ...

  8. [读书笔记]python3.5实现socket通讯(TCP）

    TCP连接: tcp是面向连接的一个协议,意味着,客户端和服务器开发发送数据之前,需要先握手创建一个TCP连接.TCP连接的一端与客户端套接字相互联系,另一端与服务器套接字相联系.当创建该TCP连接的 ...

  9. Defraggler(磁盘整理软件) V2.21.993 绿色版

    软件名称: Defraggler(磁盘整理软件) 软件语言: 简体中文 授权方式: 免费软件 运行环境: Win 32位/64位 软件大小: 5.0MB 图片预览: 软件简介: Defraggler ...

  10. 【IE6的疯狂之六】li在IE中底部3像素的BUG（增加浮动解决问题）

    今天开发项目中碰到一个li在IE中的BUG,先来看设计原型(如图:) 两个红色中间是<li>1px的底边框: 我写的代码如下: ============================== ...