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 就好. 上一篇把二维的封装好 ...
随机推荐
- expect的使用
1. expect概述 1.1 expect的功能 脚本执行时,有时会需要人工进行交互输入,这时可以通过expect工具来实现自动交互. expect是一种shell解释器,但是expect可以在命令 ...
- linux串口编程
按照对linux系统的理解,串口编程的顺序无非就是open,read,write,close,而串口有波特率.数据位等重要参数需要设置,因此还应该用到设置函数,那么接下来就带着这几个问题去学习linu ...
- mysql(视图 事务 索引 外键)
视图 视图本质就是对查询的封装 创建视图(定义视图 起名以v_开头) create view v_students as select classes.name as c_name ,stud ...
- Unix Socket 代理服务 unix域套接字
基于Unix Socket的可靠Node.js HTTP代理实现(支持WebSocket协议) - royalrover - 博客园 https://www.cnblogs.com/accordion ...
- 深入理解 MySQL 索引底层原理
https://mp.weixin.qq.com/s/qHJiTjpvDikFcdl9SRL97Q
- cpp异常机制思考
https://www.cnblogs.com/qq329914874/p/6734701.html
- PAT甲级1056Mice and Rice
目录 题目介绍 题解 解题思路 代码 参考链接 题目介绍 题目链接 https://pintia.cn/problem-sets/994805342720868352/problems/9948054 ...
- centos7+python3+selenium+chrome
一.安装GUI图形化界面 (1)安装GUI图形化界面 yum groupinstall "GNOME Desktop" "Graphical Administration ...
- collections,random
collections模块 在内置数据类型(dict.list.set.tuple)的基础上,collections模块还提供了几个额外的数据类型:Counter.deque.defaultdict. ...
- idea一定要做的配置
自动编译开关 忽略大小写开关 IDEA默认匹配大小写,如果你开了这个开关,你无论输入String或者string都会出现代码提示或者智能补充 智能导包开关 两个选项勾上:自动导入不明确的结构.智能优化 ...