还有其他类似方法,以后再加,直接上代码和图

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<style>
div{
border:1px solid black; }
#div1{
height:100px;
width:100px;
background-color:red;
}
#div2{
height:50px;
width:50px;
background-color:yellow;
}
</style>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script> <script type="text/javascript">
function append1(){
$("#div1").append($("#div2"));
} function prependTo1(){
$("#div2").prependTo($("#div1"));
} function after1(){
$("#div1").after($("#div2"));
}
</script> </head> <body> <div id="div1">div1</div>
--分割线--
<div id="div2">div2</div> <input type="button" value="append" onclick="append1();"></input>&nbsp;
<input type="button" value="prependTo" onclick="prependTo1();"></input>&nbsp;
<input type="button" value="after" onclick="after1();"></input>&nbsp;
</body>
</html>

`页面初始化


 
 
 

·append

   

 

  

·prependTo



 

·after



 

  • 大小: 3.5 KB
  • 大小: 3.3 KB
  • 大小: 3.6 KB
  • 大小: 3.5 KB

Jquery 《不想工作系列》--整理一下append、prependTo、after的区别的更多相关文章

  1. 《基于JQuery和CSS的特效整理》系列分享专栏

    <基于JQuery和CSS的特效整理>已整理成PDF文档,点击可直接下载至本地查阅https://www.webfalse.com/read/201724.html 文章 一款基于jQue ...

  2. php开发面试题---jquery和vue对比(整理)

    php开发面试题---jquery和vue对比(整理) 一.总结 一句话总结: jquery的本质是更方便的选取和操作DOM对象,vue的本质是数据和页面分离 反思的回顾非常有用,因为决定了我的方向和 ...

  3. jQuery源码分析系列

    声明:本文为原创文章,如需转载,请注明来源并保留原文链接Aaron,谢谢! 版本截止到2013.8.24 jQuery官方发布最新的的2.0.3为准 附上每一章的源码注释分析 :https://git ...

  4. JQuery之append和appendTo的区别,还有js中的appendChild用法

    JQuery之append和appendTo的区别 append()前面是要选择的对象,后面是要在对象内插入的元素内容 appendTo()前面是要插入的元素内容且为Jquery对象,而后面是要选择的 ...

  5. [转]jQuery源码分析系列

    文章转自:jQuery源码分析系列-Aaron 版本截止到2013.8.24 jQuery官方发布最新的的2.0.3为准 附上每一章的源码注释分析 :https://github.com/JsAaro ...

  6. jQuery源码分析系列(转载来源Aaron.)

    声明:非本文原创文章,转载来源原文链接Aaron. 版本截止到2013.8.24 jQuery官方发布最新的的2.0.3为准 附上每一章的源码注释分析 :https://github.com/JsAa ...

  7. java学习笔记系列整理说明

    java学习笔记系列整理说明 ​ 陆陆续续也巩固学习java基础也有一段时间了,这里整理了一些我认为比较的重要的知识点,供自己或者读者以后回顾和学习.这是一个学习笔记系列,有自己的整理重新撰写的部分, ...

  8. jQuery源码分析系列——来自Aaron

    jQuery源码分析系列——来自Aaron 转载地址:http://www.cnblogs.com/aaronjs/p/3279314.html 版本截止到2013.8.24 jQuery官方发布最新 ...

  9. 原生JS研究:学习jquery源码,收集整理常用JS函数

    原生JS研究:学习jquery源码,收集整理常用JS函数: 1. JS获取原生class(getElementsByClass) 转自:http://blog.csdn.net/kongjiea/ar ...

随机推荐

  1. JavaSE 学习笔记之正则表达式(二十五)

    正则表达式:其实是用来操作字符串的一些规则. 好处:正则的出现,对字符串的复杂操作变得更为简单. 特点:将对字符串操作的代码用一些符号来表示.只要使用了指定符号,就可以调用底层的代码对字符串进行操作. ...

  2. [bzoj 1042][HAOI2008]硬币购物(用容斥原理弄背包)

    题目:http://www.lydsy.com:808/JudgeOnline/problem.php?id=1042 分析: 解法很巧妙,用f[i]表示四种硬币A.B.C.D的数量不考虑的情况下弄成 ...

  3. Ubuntu 16.04下MySQL 5.7.18取消开机启动(解决无法使用Sysvinit(update-rc.d/sysv-rc-conf)脚本关闭)

    首先了解以下运行级别对应工具的变化历史: 1.Ubuntu 6.10及以前版本使用Sysvinit. 2.Ubuntu 14.10及以前版本使用Upstart但是还留着Sysvinit并存. http ...

  4. react-浏览后的想法

  5. 1. 少了一个PermMissingElem Find the missing element in a given permutation.

    少了一个: package com.code; import java.util.Arrays; public class Test03_2 { public static int solution( ...

  6. [Javascript] JavaScript赋值时的传值与传址

    JavaScript中有两种不同数据类型的值,分别是基本数据类型与引用数据类型 基本数据类型包含5类,分别是:Number.String.Boolean.Null.Undefined 引用数据类型包含 ...

  7. Solidworks在哪里找到内六角螺钉 内六角螺栓保准件

    GB-screws-凹头螺钉-出来了  

  8. Redis总结(五)缓存雪崩和缓存穿透等问题 Web API系列(三)统一异常处理 C#总结(一)AutoResetEvent的使用介绍(用AutoResetEvent实现同步) C#总结(二)事件Event 介绍总结 C#总结(三)DataGridView增加全选列 Web API系列(二)接口安全和参数校验 RabbitMQ学习系列(六): RabbitMQ 高可用集群

    Redis总结(五)缓存雪崩和缓存穿透等问题   前面讲过一些redis 缓存的使用和数据持久化.感兴趣的朋友可以看看之前的文章,http://www.cnblogs.com/zhangweizhon ...

  9. 『干货』分享你最喜欢的技巧和提示(Xcode,objective-c,swift,c...等等)

    亲爱的读者们,你们好 !年底将近,分享从过去一年你最喜欢的技巧和建议作为礼物送给新手们.提交你的最喜欢的迅速或objc琐事,实用的提示,意外的发现,实用的解决方法,没用的迷恋,或不论什么其它你认为今年 ...

  10. Android首次启动时间长优化之预编译提取Odex

        提示!应用程序的安装有两种情况,第一:首次启动系统时安装.第二:系统启动完毕后安装. 本篇博文基于第一种安装场景.在系统首次启动的场景中,系统会对/system/app./system/pri ...