JS编程练习:封装insertAfter函数(功能类似于系统insertBefor)

那么insertAfter()要实现的功能: 在指定的子节点后面插入新的子节点;
1 <body>
2 <div>
3 <p></p>
4 <span></span>
5 <em></em>
6 <i></i>
7 </div>
8
9 <script type="text/javascript">
10 Element.prototype.insertAfter = function(targetNode,afterNode){
11 var beforNode = afterNode.nextElementSibling;
12
13 if(beforNode == null){
14 this.appendChild(targetNode);
15 }else{
16 this.insertBefore(targetNode,beforNode);
17 }
18 }
19
20 var div = document.getElementsByTagName('div')[0];
21 var span = document.getElementsByTagName('span')[0];
22 var i = document.getElementsByTagName('i')[0];
23 var a = document.createElement('a');
24 </script>
25 </body>

--------------------------------------------------------------------------

JS编程练习:封装insertAfter函数(功能类似于系统insertBefor)的更多相关文章
- JS学习笔记 - 封装getPosition函数、一串跟着鼠标的div
function getPosition(ev) { var scrollTop = document.documentElement.scrollTop || document.body.scrol ...
- 原生JS封装_new函数,实现new关键字的功能
1.前言 众所周知:没有对象怎么办?那就new一个! 那么在JS中,当我们new一个对象的时候,这个new关键字内部都干了什么呢? 现在我们就来剖析一下原生JS中new关键字内部的工作原理. 2.原生 ...
- JS事件 编程练习-自制计算器 使用JS完成一个简单的计算器功能。实现2个输入框中输入整数后,点击第三个输入框能给出2个整数的加减乘除。
编程练习 使用JS完成一个简单的计算器功能.实现2个输入框中输入整数后,点击第三个输入框能给出2个整数的加减乘除. 提示:获取元素的值设置和获取方法为:例:赋值:document.getElement ...
- jQuery编写插件--封装全局函数的插件(一些常用的js验证表达式)
上一篇写到了jQuery插件的3种类型,介绍了第一种类型的写法--封装jQuery对象的方法插件.这一篇要介绍第二种插件类型:封装全局函数的插件:这类插件就是在jQuery命名空间内部添加函数:这类插 ...
- js 高程 22.1.4 函数绑定 bind() 封装分析
js 高程 书中原话(斜体表示): 22.1.4 函数绑定 另一个日益流行的高级技巧叫做函数绑定.函数绑定要创建一个函数,可以在特定的this 环境中 以指定参数调用另一个函数.该技巧常常和回调函数与 ...
- js数据类型的检测总结,附面试题--封装一个函数,输入任意,输出他的类型
一.javascript 中有几种类型的值 1.基本数据类型 : 包括 Undefined.Null.Boolean.Number.String.Symbol (ES6 新增,表示独一无二的值) 特点 ...
- js cookie创建读取删除函数封装
js cookie创建读取删除函数封装 一.总结 都是为了方便操作,这样弄了很方便 1.创建cookie的函数封装的作用:方便设置过期时间expire,方便设置键和值 2.查询cookie的数据封装的 ...
- asp.net类似于js中的setTimeOut()的函数作用?
asp.net类似于js中的setTimeOut()的函数作用? 插入这行即可,定时2秒,再运行下一步: System.Threading.Thread.Sleep(); 加个随机数 Random r ...
- Echart使用js进行封装成函数
Echart使用js进行封装成函数 主要是对 json 串的封装,使用 js 进行对 json 的解析.之间用的最多是循环取出数组中的值,如果拿去使用可直接修改 json 就好. 上一篇把二维的封装好 ...
随机推荐
- HTML5表格详细教程
HTML5表格 文章目录 HTML5表格 5.1 定义表格 5.1.1 普通表格.列标题 5.1.2 表格标题 5.1.3 表格行分组.表格列分组 5.2 表格属性 5.2.1 单线表格.分离单元格 ...
- Docker 拉取镜像速度太慢
Docker Hub 是我们分发和获取 Docker 镜像的中心,但由于服务器位于海外,经常会出现拉取/上传镜像时速度太慢或无法访问的情况.再加上运营方不断对 Docker Hub 的免费使用进行限制 ...
- Privacy-Enhanced Mail (PEM) Privacy Enhancement for Internet Electronic Mail
小结 1. 加密基本流程 本地格式标准格式认证(填充与完整性检查)与加密可打印编码 Privacy-Enhanced Mail (PEM) RFC 2313 - PKCS #1: RSA Encryp ...
- loj10157
太平王世子事件后,陆小凤成了皇上特聘的御前一品侍卫. 皇宫以午门为起点,直到后宫嫔妃们的寝宫,呈一棵树的形状,某些宫殿间可以互相望见.大内保卫森严,三步一岗,五步一哨,每个宫殿都要有人全天候看守,在不 ...
- HTTPS是怎么保证数据安全传输的?
前言 关于HTTPS的连接过程,也是老生常谈的话题了. 其中涉及到的数字证书.电子签名.SSL/TLS.对称加密.非对称加密的问题总是让人摸不清头脑,不知道怎么回答. 今天就和大家再熟悉熟悉这其中千丝 ...
- Prometheus+Grafana监控SpringBoot
Prometheus+Grafana监控SpringBoot 一.Prometheus监控SpringBoot 1.1 pom.xml添加依赖 1.2 修改application.yml配置文件 1. ...
- SparkMLlib—协同过滤推荐算法,电影推荐系统,物品喜好推荐
SparkMLlib-协同过滤推荐算法,电影推荐系统,物品喜好推荐 一.协同过滤 1.1 显示vs隐式反馈 1.2 实例介绍 1.2.1 数据说明 评分数据说明(ratings.data) 用户信息( ...
- linux(9)find命令详解
find命令格式: find path -option [ -print ] [ -exec -ok command ] {} \; find命令的参数: path:要查找的目录路径. ~ 表示$HO ...
- 自定义 ocelot 中间件输出自定义错误信息
自定义 ocelot 中间件输出自定义错误信息 Intro ocelot 中默认的 Response 中间件在出错的时候只会设置 StatusCode 没有具体的信息,想要展示自己定义的错误信息的时候 ...
- k8s~kubectl常用命令
查看所有 pod 列表, -n 后跟 namespace, 查看指定的命名空间 kubectl get pod kubectl get pod -n kube kubectl get pod -o w ...