在dom的原生api中,只用insertBefore,没有insertAfter,借助原有的api,可以模拟一个insterAfter。

function insterAfter(newElement,targetElement){
var parent = targetElement.parentNode;
if(parent.lastChild == targetElement){
parent.appendChild(newElement);
}
else{
parent.insertBefore(newElement,targetElement.nextSibling);
}
}
先找父级元素,若目标元素为最后一个元素,直接append到父级末尾,
如果不是,则利用insertBefore插入到目标元素的下一个元素的前面

dom方法insertAfter的实现的更多相关文章

  1. DOM – (w3school)1.DOM 方法 + 2.DOM属性 + 3.DOM 元素

      1.DOM 方法   一些 DOM 对象方法 这里提供一些您将在本教程中学到的常用方法: 方法 描述 getElementById() 返回带有指定 ID 的元素. getElementsByTa ...

  2. Java解析XMl文件之SAX和DOm方法

    如题,这两种方法的jar包都在jdk中,不需要下载. 先来说下目录结构: 首先建一个Peron类封装person.xml的属性:DomParseService和SaxParseService分别为两种 ...

  3. javascript插入before(),after()新DOM方法

    随着web的技术突飞猛进的发展.HTML5 ES6等新技术的发展,与此同时DOM等标准也在悄悄的进步,各大浏览器也在悄悄的发展适配新的属性和方法,今天我们来看看Javascript新的DOM的方法 二 ...

  4. 操作 html 的时候是使用 dom 方法还是字符串拼接?

    比如一个列表里面有很多个 li,要给他们加上数据.但多少个 li 是不确定的,由后台数据确定.这时候,就要动态生成 html 内容了. 那么,这个过程, 是使用 += 方法把标签.数据进行一个个的字符 ...

  5. Dom方法,解析XML文件

    Dom方法,解析XML文件的基本操作 package com.demo.xml.jaxp; import java.io.IOException; import javax.xml.parsers.D ...

  6. before(),after(),prepend(),append()等新DOM方法简介

    一.DOM API也在不断升级 web前端标准一直在不断升级,比方说,说了很多年的HTML5.CSS3,以及天天见的ES6. 然后,似乎就没有然后了.实际上,除了HTML5/CSS3/ES6+,关于D ...

  7. 【js常用DOM方法】

    介绍几个js DOM的常用方法 获取元素节点 getElementById  getElementsByTagName  getElementsByClassName 先写一个简单的网页做测试: /* ...

  8. HTML DOM方法

    一.HTML DOM的作用 HTML DOM方法是我们可以在节点(html元素)上执行的动作. HTML DOM属性是我们可以在节点(html元素)设置和修改的值. 编程接口: 可以通过JavaScr ...

  9. 公司内部的一篇关于dom方法的分享

    第一部分 dom node类型 nodeType 属性 nodeType 属性返回节点的类型.nodeType 是只读的. 比较重要的节点类型有: 元素类型 NodeType 元素 1 属性 2 文本 ...

随机推荐

  1. UVA 11627 Slalom(二分)

    二分,判断的时候,一个点一个点的考虑肯定是不行啦,考虑的单位是一个区间, 每次左端点尽量向左边移动,右端点尽量向右,得到下次可以达到的范围,检查一下和下一个区间有没有交集. #include<b ...

  2. PHP程序Laravel框架的优化技巧

    Laravel是一套简洁.优雅的php Web开发框架(PHP Web Framework).它可以让你从杂乱的代码中解脱出来,可以帮你构建一个完美的网络app,而且每行代码都简洁.富于表达力.而性能 ...

  3. 2018.2.09 php学习(二)

    1.用索引提高效率: 索引是表的一个概念部分,用来提高检索数据的效率,ORACLE使用了一个复杂的自平衡B-tree结构. 通常,通过索引查询数据比全表扫描要快. 当ORACLE找出执行查询和Upda ...

  4. momentum公式

    momentum对于w的更新公式: http://caffe.berkeleyvision.org/tutorial/solver.html

  5. JavaScript -- DOM事件

    什么是事件 事件就是文档或浏览器窗口中发生的一些特定的交互瞬间.比如你在网页上见到的鼠标点击一个按钮,按钮的颜色发生了变化,就是因为这个标签绑定了点击事件 鼠标事件 onload:页面加载时触发 on ...

  6. HTML5<nav>元素

    HTML5中<nav>元素定义页面导航链接的部分区域,但并不是所有的链接都放到nav元素里面. 实例: <header id="pageHeader"> & ...

  7. 01_3_创建一个Action

    01_3_创建一个Action 1. 定义一个action 具体视图的返回可以由用户自己定义的Action来决定 具体的手段是根据返回的字符串找到相应的配置项,来决定视图的内容 具体Action的实现 ...

  8. Vue和MVVM对应关系

    Vue和MVVM的对应关系 Vue是受MVVM启发的,那么有哪些相同之处呢?以及对应关系? MVVM(Model-view-viewmodel) MVVM还有一种模式model-view-binder ...

  9. 【原】基于matlab的蓝色车牌定位与识别---绪论

    本着对车牌比较感兴趣,自己在课余时间摸索关于车牌的定位与识别,现将自己所做的一些内容整理下,也方便和大家交流. 考虑到车牌的定位涉及到许多外界的因素,因此有必要对车牌照的获取条件进行一些限定: 一.大 ...

  10. apicloud入门学习笔记1:简单介绍

    官网地址:https://www.apicloud.com/ 新手开发指南:https://docs.apicloud.com/APICloud/junior-develop-guide 开发语言:H ...