<body>

     <div id="div1">

         <p id="p1">第一段</p>

         <p id="p2">第二段</p>

     </div>

     <!--

         DOM :文档对象模型

         1、创建新的 HTML元素

             创建该元素

             找一个已存在的元素，去追加元素；

             <div id="div1">

                 <p id="p1">第一段</p>

                 <p id="p2">第二段</p>

             </div>

         2、删除已有HTML元素

             须找到要删除元素的父元素，再删除子元素

         -->

     <script>

         var param = document.createElement("p");

         var node = document.createTextNode("这是新文本");

         param.appendChild(node);

         var ele = document.getElementById("div1");

         var child = document.getElementById("p1");

         //添加元素

         ele.appendChild(param);

         //删除元素

         ele.removeChild(child);

     </script>

 </body>

js基础：对DOM进行操作，删除、添加元素的更多相关文章

  1. 【2017-03-28】JS基础、DOM操作

    一.JS基础 1.javascript功能 ⑴进行数据运算 ⑵控制浏览器功能 ⑶控制元素的属性.样式.内容 2.javascript位置和格式 可以放在html页的任意位置,也可以创建一个以js结尾的 ...

  2. js基础例子dom+原型+oop基础知识记录01

    //oo:概念是计算机中对于现实世界的理解和抽象的方法 //由计算机利用编程技术发展到现在的产物 //面向对象几要素 //对象:由属性和方法组成的集合 //属性:保存数据,存储在对象内存空间中的唯一的 ...

  3. JavaScript学习 - 基础(八) - DOM 节点 添加/删除/修改/属性值操作

    html代码: <!--添加/删除/修改 --> <div id="a1"> <button id="a2" onclick=&q ...

  4. js基础篇(dom操作，字符串，this等)

    首先我们来看这样一道题 <div id='foo' class='aa bb cc'></div>写出如何判断此div中是否含有aa(注:aa成立,aaa不成立) 首先,我们一 ...

  5. 【JS基础】DOM操作

    appendChild() //向节点添加最后一个子节点 createElement() //创建元素节点 createTextNode() //创建文本节点,字符串值

  6. JavaScript (JS)基础：DOM 浅析 (含数组Array、字符串String基本方法解析)

    ①文本对象document: 例如:document.getElementById()    只获取一个对象          document.getElementsByTagName()   获取 ...

  7. Js基础知识1-数组操作全解

    数组操作全解 js变量类型 var string; var name = "student",age=12; //underfined.null.boolean.string.nu ...

  8. js基础之DOM中元素对象的属性方法

    在 HTML DOM (文档对象模型)中,每个部分都是节点. 节点是DOM结构中最基本的组成单元,每一个HTML标签都是DOM结构的节点. 文档是一个    文档节点 . 所有的HTML元素都是    ...

  9. HTML基础之DOM常用操作

    DOM(Document Object Model ),文档对象模型,主要用于对HTML和XML文档的内容进行操作. 一.查找节点 直接获取标签 document.getElementById('i1 ...

  10. js基础之DOM

    一.创建子节点 发帖在顶部显示: var oBtn = document.getElementById('btn1'); var oUl = document.getElementById('ul1' ...

随机推荐

  1. Loadrunner手动编写包含事务、检查点、关联等元素的脚本实例

    一.前言: 本文适合初学者,包含很多细节,包括 二.准备: 1.以虚拟机中的Linux系统作为服务器,开启bugfree服务. 2.以fiddler作为抓包工具,辅助脚本开发. 3.脚本流程:bugf ...

  2. 浅谈Android中Serializable和Parcelable使用区别

    版权声明:本文出自汪磊的博客,转载请务必注明出处. 一.概述 Android开发的时候,我们时长遇到传递对象的需求,但是我们无法将对象的引用传给Activity或者Fragment,我们需要将这些对象 ...

  3. Java设计模式之单例模式详解

    在Java开发过程中,很多场景下都会碰到或要用到单例模式,在设计模式里也是经常作为指导学习的热门模式之一,相信每位开发同事都用到过.我们总是沿着前辈的足迹去做设定好的思路,往往没去探究为何这么做,所以 ...

  4. 纯css美化单选、复选框

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  5. HTMLCSS实现左侧固定宽度右侧内容可滚动

    在做移动端页面的时候,经常会碰到一个div中分左右两个div,左侧div固定宽度或百分比,右侧div中内容左右溢出,需要左右滑动才可以浏览到全部内容,为此写了一个demo. 处理这个问题的核心关键点是 ...

  6. 翻煎饼 Stacks of Flapjacks

    题意:本题意为煎饼排序,大的放在上面,小的放在下面(此题输入是从上到下输入的),为煎饼排序是通过一系列的"翻转"动作来完成的.翻转动作就是将一个小铲插到一叠煎饼中的某两个煎饼之间, ...

  7. iKcamp团队制作｜基于Koa2搭建Node.js实战（含视频）☞ 中间件用法

    中间件用法--讲解 Koa2 中间件的用法及如何开发中间件

  8. Android之通过网络播放一首简单的音乐

    首先,附上程序执行后的效果.例如以下图所看到的: 一.部署一个web项目到tomcatserver上: 1.这个小程序是结合网络来播放一首音乐的,首先,把我们搞好的一个web项目放置在tomcat安装 ...

  9. java 可变參数

    我们在某些特定的需求环境下,可能要对某一个方法中的參数进行一些操作,并且这些方法中的參数是不规定的,那么问题来了,我们该怎么办呢? java事实上就为我们考虑了这样的情况,那就是使用可变參数 可变參数 ...

  10. 我理解的malloc()和free()。

    关于malloc和free这两个函数,malloc的使用方法演示样例:int *p=(int *)malloc(2*sizeof(int)); 它表示在堆中开辟一块大小为2*sizeof(int)的一 ...