创建新的 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. windows系统下快捷命令

    mstsc 远程计算机 regedit 注册表

  2. Altium Designer 快速修改板子形状为Keep-out layer大小

    Altium Designer 快速修改板子形状为Keep-out layer大小 1,切换到 Keep-out layer层, 2,选择层,快捷键为S+Y: 3,设计>>板子形状> ...

  3. ASP.NET CORE 1.0 初次接触

    vs2015 update3 升级后,可以创建asp.net core 1.0 的web应用了, 默认模版,发布到指定文件夹 服务器上需要安装 DotNetCore.1.0.0-WindowsHost ...

  4. 使用redis缓存数据需要注意的问题以及个人的一些思考和理解

    之前我有博客也尝试过使用redis,在实际的项目中确实作用挺大的.至少对于数据的频繁读取来说都起着至关重要的作用. 但是随着技术的学习,慢慢的业务要复杂起来,以后也许会用到redis集群,所以在这边查 ...

  5. js的eval函数解析后台返回的json数据时为什加上圆括号eval("("+data+")")，而HTML页面定义的数据不用

    一,情况如下,这是成功代码: $(function () { $.ajax({ url: "Demo.aspx", type: "post", data: { ...

  6. 网页视频下载牛逼工具，支持各种格式转换，比如腾讯视频格式qlv转mp4

    这种思路真是创新,原文地址:http://jingyan.baidu.com/article/5225f26b03f047e6fb090860.html 软件工具名字:维棠下载. 上图: 1:搜索视频 ...

  7. c++ 常见问题之 const

    const 默认状态下const对象仅在文件内有效,添加extern关键字可以在多个文件共享 const 引用: 可以把引用绑定到const对象上,对常量的引用不能被用作修改它所绑定的对象 const ...

  8. Logstash使用grok过滤nginx日志（二）

    在生产环境中,nginx日志格式往往使用的是自定义的格式,我们需要把logstash中的message结构化后再存储,方便kibana的搜索和统计,因此需要对message进行解析. 本文采用grok ...

  9. shell 文件中列的整合成一个文件

    原文件 第一种方法 [root@wxb- jt]# paste -d "," b c d ,q, , ,e, ,r, ,t, [root@wxb- jt]# paste b c d ...

  10. git的一些疑难点

    一 .git reset,git revert,git checkout的区别和联系 主要参考:http://www.cnblogs.com/houpeiyong/p/5890748.html git ...