【删除节点】

步骤：

① 找到对象

② 找到他的父对象 parentObj

③ parentObj.removeChild(子对象);

【例】

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <style>

        #div1{

            width: 300px;

            height: 300px;

            background: blue;

            border-bottom: 1px solid black;

        }

    </style>

    <script>

        function del(){

            var lis = document.getElementsByTagName("li");

            var lastLi = lis[lis.length-1];

            lastLi.parentNode.removeChild(lastLi);

        }

    </script>

</head>

<body>

    <input type="button" value="删除最后一个li" onclick="del();">

    <ul>

        <li>白羊</li>

        <li>金牛</li>

        <li>双子</li>

        <li>巨蟹</li>

    </ul>

</body>

</html>

【创建节点】

步骤：

① 创建对象

② 找到父对象 parentObj

③ parentObj.addChild(对象);

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <style>

        #div1{

            width: 300px;

            height: 300px;

            background: blue;

            border-bottom: 1px solid black;

        }

    </style>

    <script>

        function add(){

            //创建li

            var li = document.createElement("li");

            //创建文本节点

            var txt = document.createTextNode("海魔女");

            //插入文本节点到li

            li.appendChild(txt);

            //把li插入ul

            document.getElementsByTagName("ul")[0].appendChild(li);

        }

    </script>

</head>

<body>

    <input type="button" value="追加一个li" onclick="add();">

    <ul>

        <li>白羊</li>

        <li>金牛</li>

        <li>双子</li>

        <li>巨蟹</li>

    </ul>

</body>

</html>

Javascript 笔记与总结（2-10）删除节点，创建节点的更多相关文章

  1. Javascript 笔记与总结（2-11）暴力操作节点

    innerHTML 代表节点内的内容,能读能写 虽然不是 W3C 规定的标准,但是各浏览器都支持得很好 [例] <!DOCTYPE html> <html lang="en ...

  2. [Effective JavaScript 笔记]第22条：使用arguments创建可变参数的函数

    第21条讲述使用可变参数的函数average.该函数可处理任意数量的参数并返回这些参数的平均值. 如何创建可变参数的函数 1.实现固定元数的函数 书上的版本 function averageOfArr ...

  3. 创建节点--DOM树

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

  4. javascript数据结构与算法---二叉树（删除节点）

    javascript数据结构与算法---二叉树(删除节点) function Node(data,left,right) { this.data = data; this.left = left; t ...

  5. (转载)Javascript removeChild()不能删除全部子节点的解决办法

    在Javascript中,只提供了一种删除节点的方法:removeChild().removeChild() 方法用来删除父节点的一个子节点. 语法: parent.removeChild(thisN ...

  6. Javascript高级编程学习笔记（35）—— DOM（1）节点

    DOM JS由三部分组成 1.BOM 2.DOM 3.ECMAScript ES和BOM在前面的文章已经介绍过了 今天开始JS组成的最后一部分DOM(文档对象模型) 我们知道,JS中的这三个部分实际上 ...

  7. JavaScript对列表节点的操作：删除指定节点、删除最后一个节点、删除第一个节点、删除所有节点、增加节点

    使用菜鸟的运行环境直接测试:http://www.runoob.com/try/try.php?filename=tryjs_events <!DOCTYPE html> <html ...

  8. JavaScript笔记基础篇(二)

    基础篇主要是总结一些工作中遇到的技术问题是如何解决的,应为本人属于刚入行阶段技术并非大神如果笔记中有哪些错误,或者自己的一些想法希望大家多多交流互相学习. 1.ToFixed()函数 今天在做Birt ...

  9. js进阶 11-9/10/11 jquery创建和插入节点

    js进阶 11-9/10/11 jquery创建和插入节点 一.总结 一句话总结: 1.jquery插入节点8个方法? 内部之前,内部之后,之前,之后:各两个 append()和appendTo() ...

随机推荐

  1. C# this和base

    base关键字:其用于在派生类中实现对基类公有或者受保护成员的访问,但是只局限在构造函数.实例方法和实例属性访问器中,还有指定创建派生类实例时应调用的基类构造函数. this关键字:限定被相似的名称隐 ...

  2. Duilib非官方更新贴~

    GitHub: https://github.com/movsb/duilib.git 2014-07-20: [76a04d1]    [BugFix] 修复无法解析类似<Control/&g ...

  3. PHP 过滤 及 字符转换 函数

    PHP过滤html标签的内部函数. php过滤html的函数: strip_tags(string) 这样就可以过滤掉所有的html标签了. 如果想过滤掉除了<img src="&qu ...

  4. [转]Android的Handler总结

    一.Handler的定义:          主要接受子线程发送的数据, 并用此数据配合主线程更新UI.          解释: 当应用程序启动时,Android首先会开启一个主线程 (也就是UI线 ...

  5. 【HTML5】input类型

    * email <input type="email" name="user_email" /> * url <input type=&quo ...

  6. kali 安装火狐

    转自:http://www.kali.org.cn/thread-21271-1-1.html 安装火狐浏览器 打开终端 第一步:apt-get remove iceweasel 第二步: echo ...

  7. Hark的数据结构与算法练习之堆排序

    前言 堆排序我是看了好半天别人的博客才有了理解,然后又费了九牛二虎之力才把代码写出来,我发现我的基础真的很差劲啊……不过自己选的路一定要坚持走下去.我试着把我的理解描述出来,如有不妥之处希望大家可以指 ...

  8. ZooKeeper使用原理

    ZooKeeper的基本原理 ZNode的基本概念 ZooKeeper数据模型的结构与Unix文件系统很类似,整体上可以看作是一棵树,每个节点称做一个ZNode.每个ZNode都可以通过其路径唯一标识 ...

  9. mvc-4控制器和状态(2)

    访问视图 常见地视图模式时一个视图对应一个控制器,视图包含一个id,通过id传入控制器:在视图之中的元素则使用class 这里会使用jquery的选择器,为了减少使用,可以设置一个专门用于存放选择器到 ...

  10. 1^b+2^b+3^b+...+n^b数列

    首先,这是我自己推出来的,O(n^2),常数巨大.所以无能为力优化!所以求此数列的公式!求优化!!! 主要思想:要算b次的,那么就要先算b+1次的. 首先,我用F(i, j)表示杨辉三角第i层第j个, ...