在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. groupdel - Delete a group

    总览 SYNOPSIS groupdel group 描述 DESCRIPTION groupdel 命令会修改系统帐号档,会删除所有指定群组的信息 . 群组名须存在. 你须手动确认一下所有的档案系统 ...

  2. Problem A: 文件操作--二进制文件读入

    Problem A: 文件操作--二进制文件读入 Time Limit: 1 Sec  Memory Limit: 128 MBSubmit: 1952  Solved: 524[Submit][St ...

  3. Asp.Net Core 进阶(四)—— 过滤器 Filters

    一.介绍 Asp.Net Core Filter 使得可以在请求处理管道的特定阶段的前后执行代码,我们可以创建自定义的 filter 用于处理横切关注点. 横切关注点的示例包括错误处理.缓存.配置.授 ...

  4. Sublime +Markdown+OmniMarkupPreviewer 搭建实时预览的markdown编辑器

    浏览器实时预览 <meta http-equiv="refresh" content="0.1"> auto save 的配置 {"aut ...

  5. Dede技巧

    解决DEDE图集上传图片时跳出302错误   本地上传图集的时候突然提示网页出错,还爆出302错误. 解决办法是在include/userlogin.class.php文件中的第二行session_s ...

  6. 判断是否是同一人的方法——equals()?在Person类中提供一个比较的方法compare()返回boolean值?对象自己和自己比?

    判断是否是同一人的方法——equals() 不能直接用per1==per2,这不是对象内容的比较而是存放对象地址的值得比较 在Person类中提供一个比较的方法compare()返回boolean值 ...

  7. VueX源码分析(1)

    VueX源码分析(1) 文件架构如下 /module /plugins helpers.js index.esm.js index.js store.js util.js util.js 先从最简单的 ...

  8. NOIP2018

    非常糟糕.从未意识到过考场debuff这么严重. 果不其然,高档选手强如txc实力AK:而像我这样的中档选手就是重在考场发挥和自我调整了吧. 究竟要付出多少代价才能领会一个教训 看来要尝试更自闭一点

  9. CentOS7系统引导顺序以及排障

    引导顺序 UEFi或BIOS初始化,运行POST开机自检 选择启动设备 引导装载程序, centos7是grub2 加载装载程序的配置文件:/etc/grub.d/  /etc/default/gru ...

  10. 忘记root密码怎么办-单用户模式修改root密码

    忘记root密码怎么办-单用户模式修改root密码================================= 1,开机3秒内按下向下的方向键,目的是为了不让它进入系统,而是停留在开机界面. 2 ...