insertBefore 和 insetAfter函数详解
在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函数详解的更多相关文章
- malloc 与 free函数详解<转载>
malloc和free函数详解 本文介绍malloc和free函数的内容. 在C中,对内存的管理是相当重要.下面开始介绍这两个函数: 一.malloc()和free()的基本概念以及基本用法: 1 ...
- NSSearchPathForDirectoriesInDomains函数详解
NSSearchPathForDirectoriesInDomains函数详解 #import "NSString+FilePath.h" @implementation ...
- JavaScript正则表达式详解(二)JavaScript中正则表达式函数详解
二.JavaScript中正则表达式函数详解(exec, test, match, replace, search, split) 1.使用正则表达式的方法去匹配查找字符串 1.1. exec方法详解 ...
- Linux C popen()函数详解
表头文件 #include<stdio.h> 定义函数 FILE * popen( const char * command,const char * type); 函数说明 popen( ...
- kzalloc 函数详解(转载)
用kzalloc申请内存的时候, 效果等同于先是用 kmalloc() 申请空间 , 然后用 memset() 来初始化 ,所有申请的元素都被初始化为 0. view plain /** * kzal ...
- Netsuite Formula > Oracle函数列表速查(PL/SQL单行函数和组函数详解).txt
PL/SQL单行函数和组函数详解 函数是一种有零个或多个参数并且有一个返回值的程序.在SQL中Oracle内建了一系列函数,这些函数都可被称为SQL或PL/SQL语句,函数主要分为两大类: 单行函数 ...
- jQuery.attr() 函数详解
一,jQuery.attr() 函数详解: http://www.365mini.com/page/jquery-attr.htm 二,jQuery函数attr()和prop()的区别: http: ...
- memset函数详解
语言中memset函数详解(2011-11-16 21:11:02)转载▼标签: 杂谈 分类: 工具相关 功 能: 将s所指向的某一块内存中的每个字节的内容全部设置为ch指定的ASCII值, 块的大 ...
- CreateFile函数详解
CreateFile函数详解 CreateFile The CreateFile function creates or opens the following objects and returns ...
随机推荐
- 揭开Socket编程的面纱(留着自己慢慢看)
对TCP/IP.UDP.Socket编程这些词你不会很陌生吧?随着网络技术的发展,这些词充斥着我们的耳朵.那么我想问: 1. 什么是TCP/IP.UDP?2. Socket在哪里呢?3. Socket ...
- 多个Tomcat 配置多个JDK
- gulp 入门指南
gulp 是基于 node 实现 Web 前端自动化开发的工具,利用它能够极大的提高开发效率. 在 Web 前端开发工作中有很多"重复工作",比如压缩CSS/JS文件.而这些工作都 ...
- jquery.validata.js 插件
一.Validate插件描述 Validate是基于jQuery的一款轻量级验证插件,内置丰富的验证规则,还有灵活的自定义规则接口,HTML.CSS与JS之间的低耦合能让您自由布局和丰富样式,支持in ...
- ubuntu主机名修改
1.查看主机名 在Ubuntu系统中,快速查看主机名有多种方法: 其一,打开一个GNOME终端窗口,在命令提示符中可以看到主机名,主机名通常位于"@"符号后: 其二,在终端窗口中输 ...
- Postgresql快速写入/读取大量数据(.net)
环境及测试 使用.net驱动npgsql连接post数据库.配置:win10 x64, i5-4590, 16G DDR3, SSD 850EVO. postgresql 9.6.3,数据库与数据都安 ...
- Unreal Engine 4 Radiant UI 入门教程(零)在场景中摆放网页
相关的学习资源: https://forums.unrealengine.com/showthread.php?12097-PLUGIN-RadiantUI-SDK-UIs-HUDs-Interact ...
- 线程高级.md
例题,哲学家用餐: 在一张餐桌上坐着五个哲学家,但是却只有五根筷子,每个哲学家只有一根筷子,所以当一个哲学家要夹菜的时候需要用他旁边那个哲学家的筷子,被拿走筷子的哲学家则只能等待那个哲学家吃完放下筷子 ...
- man rsync翻译(rsync命令中文手册)
本文为命令rsync的man文档翻译,几乎所有的选项都翻译了,另外关于筛选规则部分只翻译了一部分.由于原文很多地方都比较啰嗦,所以译文中有些内容可能容易让国人疑惑,所以我个人在某些地方加上了注释.若有 ...
- python数据结构链表之单向链表
单向链表 单向链表也叫单链表,是链表中最简单的一种形式,它的每个节点包含两个域,一个信息域(元素域)和一个链接域.这个链接指向链表中的下一个节点,而最后一个节点的链接域则指向一个空值. 表元素域ele ...