在Javascript DOM编程艺术上面讲到,insertBefore(   )函数,即在已有元素前面插入一个新元素;

语法:

parentElement . insertBefore(newElement,targetElement);

新元素:你想插入的元素(newElement)

目标元素:你想把这个新元素插到哪个元素(targetElement)的前面

父元素:目标元素的父元素(parentElement)

insertBefore函数是Javascript DOM自带的函数,那么我们想在现有元素后面插入一个新元素怎么办呢

那就是创建一个insertAfter(  )函数

首先,同insertBefore函数一样,需要两个参数(目标元素新元素

javascript代码如下:

function insertAfter (newElement,targetElement){
var parent =targetElement.parentNode;
//定义目标元素的父项parent
if(parent.lastchild == targetElement]{
//如果目标元素是父元素的最后一个childnode,那么直接用appendchild()添加插入元素
parentElement.appendChild(newElement)
}else{
parentElement.insertBefore(newElement,targetElement.nextSibling);
//nestSiling 获取节点的下一个同级节点;
}
};

  

insertBefore 和 insetAfter函数详解的更多相关文章

  1. malloc 与 free函数详解<转载>

    malloc和free函数详解   本文介绍malloc和free函数的内容. 在C中,对内存的管理是相当重要.下面开始介绍这两个函数: 一.malloc()和free()的基本概念以及基本用法: 1 ...

  2. NSSearchPathForDirectoriesInDomains函数详解

    NSSearchPathForDirectoriesInDomains函数详解     #import "NSString+FilePath.h" @implementation ...

  3. JavaScript正则表达式详解(二)JavaScript中正则表达式函数详解

    二.JavaScript中正则表达式函数详解(exec, test, match, replace, search, split) 1.使用正则表达式的方法去匹配查找字符串 1.1. exec方法详解 ...

  4. Linux C popen()函数详解

    表头文件 #include<stdio.h> 定义函数 FILE * popen( const char * command,const char * type); 函数说明 popen( ...

  5. kzalloc 函数详解(转载)

    用kzalloc申请内存的时候, 效果等同于先是用 kmalloc() 申请空间 , 然后用 memset() 来初始化 ,所有申请的元素都被初始化为 0. view plain /** * kzal ...

  6. Netsuite Formula > Oracle函数列表速查(PL/SQL单行函数和组函数详解).txt

    PL/SQL单行函数和组函数详解 函数是一种有零个或多个参数并且有一个返回值的程序.在SQL中Oracle内建了一系列函数,这些函数都可被称为SQL或PL/SQL语句,函数主要分为两大类: 单行函数 ...

  7. jQuery.attr() 函数详解

    一,jQuery.attr()  函数详解: http://www.365mini.com/page/jquery-attr.htm 二,jQuery函数attr()和prop()的区别: http: ...

  8. memset函数详解

    语言中memset函数详解(2011-11-16 21:11:02)转载▼标签: 杂谈 分类: 工具相关  功 能: 将s所指向的某一块内存中的每个字节的内容全部设置为ch指定的ASCII值, 块的大 ...

  9. CreateFile函数详解

    CreateFile函数详解 CreateFile The CreateFile function creates or opens the following objects and returns ...

随机推荐

  1. 信息安全的核心:CIA三元组 | 安全千字文系列1

    我们总是在说信息安全管理,那么信息安全管理到底是在管什么?我们要如何定义信息安全? 这里就要引出信息安全最基本的概念:CIA三元组. 这里的 C,指的是Confidentiality机密性 这里的 I ...

  2. tokuDB 安装与备份小记

    线上的数据增长越来越快,数据量的增长也愈来愈大,尤其是日志类数据,这对于数据迁移.数据备份恢复而言,都是一个非常大的挑战. 于是想到了 13 年开源 tokuDB 存储引擎,来解决我们迫在眉睫的容量问 ...

  3. CSS自适应的占位符效果

    一种不错的自适应input效果,分享一下.html section : <div style="width:500px;height:500px;margin:300px auto;b ...

  4. 在当前光标处按指定属性显示字符 - BOIS中断

    在当前光标处按指定属性显示字符 - BOIS中断 最简单的调试方式是打印. 编写MBR时,判断MBR是否加载并运行,最直接的方式就是打印一个字符. INT 0x10 功能描述: 在当前光标处按指定属性 ...

  5. php7.0版本不再以类名命名构造函数

    <?php class Car { var $color = "add"; function Car($color="green") { $this-&g ...

  6. CSS3-loading动画(一)

    前两天从一个网站中看到了一些比较好的loading动画效果,是用纯CSS3来写的,感觉不错,就尝试着照着效果来自己写出来. 在开始之前,先复习一个小知识:CSS3新增的关键帧动画,可以用来实现很多的动 ...

  7. 读Zepto源码之Event模块

    Event 模块是 Zepto 必备的模块之一,由于对 Event Api 不太熟,Event 对象也比较复杂,所以乍一看 Event 模块的源码,有点懵,细看下去,其实也不太复杂. 读Zepto源码 ...

  8. Socket通信中的 BeginReceive与EndReceive

    BeginReceive 与endReceive 必须成对出现,如果BeginReceive没有及时调用endReceive,可能会出现数据被从buffer中读取二次,如果在下面这行代码下面加入别的代 ...

  9. docker~save与load的使用

    回到目录 对于没有私有仓库来说,将本地镜像放到其它服务器上执行时,我们可以使用save和load方法,前者用来把镜像保存一个tar文件,后台从一个tar文件恢复成一个镜像,这个功能对于我们开发者来说还 ...

  10. node 控制 树莓派做的天气闹钟

    node 控制 树莓派做的天气闹钟 在成都上班,下雨天堵车,迟到的概率会很大. 正好手上有一块树莓派 ,做了一个晴雨闹钟. 下雨天 早上 7:00叫我起床 晴天 早上 7:30叫我起床 将自己喜欢的歌 ...