在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. cv2.solvepnp 相机的位姿估计

    预备知识   图像坐标系:   理想的图像坐标系原点O1和真实的O0有一定的偏差,由此我们建立了等式(1)和(2),可以用矩阵形式(3)表示. 相机坐标系(C)和世界坐标系(W): 通过相机与图像的投 ...

  2. Python中Numpy ndarray的使用

    本文主讲Python中Numpy数组的类型.全0全1数组的生成.随机数组.数组操作.矩阵的简单运算.矩阵的数学运算. 尽管可以用python中list嵌套来模拟矩阵,但使用Numpy库更方便. 定义数 ...

  3. N17_判断树B是不是树A的子结构

    题目描述 输入两棵二叉树A,B,判断B是不是A的子结构.(ps:我们约定空树不是任意一个树的子结构) package new_offer; /** * 输入两棵二叉树A,B,判断B是不是A的子结构.( ...

  4. Problem N: 求二维数组中的鞍点【数组】

    Problem N: 求二维数组中的鞍点[数组] Time Limit: 1 Sec  Memory Limit: 128 MBSubmit: 2764  Solved: 1728[Submit][S ...

  5. python plt 保存jpg出错

    pip install pillow就可以解决

  6. Spring boot 集成Kafka

    搭建Kafka集群,参考: https://www.cnblogs.com/jonban/p/kafka.html 源码示例如下: 1.新建 Maven 项目 kafka 2.pom.xml < ...

  7. js完成打印功能

    最近在做项目要求实现打印功能,我采用js方式来实现 window.print();会弹出打印对话框,打印的是window.docunemt.body.innerHTML中的内容,可以局部打印,也可以全 ...

  8. 01_2Java开发环境的下载 安装 配置

    01_2Java开发环境的下载 安装 配置 l 配置Java开发环境步骤(WindowsXP) l 下载并按照最新版本的J2SDK l 设置Windows环境变量 l 选择合适的文本编辑器或使用集成开 ...

  9. 关于cocos2dx for lua资源加载优化方案

    之前我写游戏加载都是从一个json文件写入要加载的文件名来实现加载,但是如果资源 比较多的情况下,会导致非常难管理,需要逐个写入.所以换了另外一种方式来加载文件. 首先,我是通过场景之前的切换时候,加 ...

  10. OC和C++的区别

    C++语言特点: 1.在C语言的基础上进行扩充和完善,使C++兼容了C语言的面向过程特点,又成为了一种面向对象的程序设计语言: 2.可以使用抽象数据类型进行基于对象的编程: 3.可以使用多继承.多态进 ...