jq文档的说明是

1、after函数

定义和用法：

after() 方法在被选元素后插入指定的内容。

语法：

$(selector).after(content)

实例：

<html>
<head>
　　<script type="text/JavaScript" src="/jQuery/jquery.js"></script>
　　<script type="text/javascript">
　　　　$().ready(function(){
　　　　　　$("button").click(function(){
　　　　　　　　$("span").after("<a href="#">ddddd</a>")

　　　　　　})
　　　　})
　　</script>
</head>

<body>
　　<span>aaaaaaaaaaaaaaa</span>
　　<button>after函数</button>
</body>
</html>

结果如下：

<span>aaaaaaaaaaaaaaa</span>
<a href="#">ddddd</a>

span标签后面多了一个a标签

2、append函数

定义和用法：

append() 方法在被选元素的结尾（仍然在内部）插入指定内容。

语法：

$(selector).append(content)

实例：

<html>
<head>
　　<script type="text/javascript" src="/jquery/jquery.js"></script>
　　<script type="text/javascript">
　　　　$().ready(function(){
　　　　　　$("button").click(function(){
　　　　　　　　$("span").append("<a href="#">ddddd</a>")

　　　　　　})
　　　　})
　　</script>
</head>

<body>
　　<span>aaaaaaaaaaaaaaa</span>
　　<button>after函数</button>
</body>
</html>

结果如下：

<span>aaaaaaaaaaaaaaa<a href="#">ddddd</a></span>
span标签里面多了一个a标签

3、appendTo函数

定义和用法：

appendTo() 方法在被选元素的结尾（仍然在内部）插入指定内容。

语法：

$(content).appendTo(selector)实例：

<html>
<head>
　　<script type="text/javascript" src="/jquery/jquery.js"></script>
　　<script type="text/javascript">
　　　　$().ready(function(){
　　　　　　$("button").click(function(){
　　　　　　　　// $("span").appendTo("<a href="#">ddddd</a>"),这样的写法是不正确的

　　　　　　　　$("<a href="#">ddddd</a>").appendTo("span")

　　　　　　})
　　　　})
　　</script>
</head>

<body>
　　<span>aaaaaaaaaaaaaaa</span>
　　<button>after函数</button>
</body>
</html>

结果如下：

<span>aaaaaaaaaaaaaaa<a href="#">ddddd</a></span>
span标签里面多了一个a标签

效果和append函数是一样，只不过它们的写法是反着来写的而已

备注：before函数与after函数相反，表示是元素的前面加入指定元素

after、append和appendTo三个函数的区别的更多相关文章

  1. jquery after append appendTo三个函数的区别

    jq文档的说明是 1.after函数 定义和用法: after() 方法在被选元素后插入指定的内容. 语法: $(selector).after(content) 实例: <html> & ...

  2. jquery：after append appendTo三个函数的区别

    1.查找元素节点      var $li = $(“ul li:eq(0)”);//获取ul标记下的第一个li,也可以写成 $(“#ulID li:eq(0)”);    2.查找元素属性 利用jq ...

  3. jq查找父类元素三个函数的区别

    parent是找当前元素的第一个父节点,parents是找当前元素的所有父节点 parent().parents()与closest()方法两两之间有类似又有不同,本篇简短的区分一下这三个方法.通过本 ...

  4. array_map、array_walk、array_filter三个函数的区别

    array_walk --- 使自定的函数能处理数组的每个元素 bool array_walk ( array &array, callback funcname [, mixed userd ...

  5. TransparentBlt、StretchBlt与BitBlt三个函数的区别

    jackyhwei 发布于 2011-10-13 10:55 点击:1080次  来自:blog.csdn.net/weiqubo BOOL StretchBlt( int x, //指定目的矩形区域 ...

  6. 【iOS开发之C语言】sprintf,strncpy,strcmp三个函数的区别

    strncpy 这个函数用于将源字符串的内容拷贝到目标字符串,会覆盖掉目标字符串的之前内容 ] = "love"; char str2[] = "cool"; ...

  7. Javascript Math ceil()、floor()、round()三个函数的区别

    Round是四舍五入的...Ceiling是向上取整..float是向下取整. ceil():将小数部分一律向整数部分进位. 如: Math.ceil(12.2)//返回13 Math.ceil(12 ...

  8. Oracle中NVL、NVL2、NULLIF 三个函数的区别?

    首先说明:NULL指的是空值,或者非法值. 1.NVL (expr1, expr2)expr1为NULL,返回expr2:不为NULL,返回expr1.注意两者的类型要一致 2.NVL2 (expr1 ...

  9. 【笔记】jquery append，appendTo，prepend，prependTo 介绍

    在jquery权威指南里面学习到这一章,很有必要介绍一下里面的内容: 首先是append(content)这个函数: 意思是将内容content加入到所选择的对象内容的后面 例如:$("di ...

随机推荐

  1. 《逐梦旅程 WINDOWS游戏编程之从零开始》笔记10——三维天空的构建&三维粒子的实现&多游戏模型的载入

    第23章 三维天空的构建 目前描述三维天空的技术主要包括三种类型,直接来介绍使用最广泛的模拟技术,详细的描述可以见作者的博文. 天空盒(Sky Box),即放到场景的是一个立方体.它是目前使用最广泛的 ...

  2. Django内置信号

    阅读目录(Content) Django中内置的signal 自定义信号 1.定义信号 2.注册信号 3.触发信号 回到顶部(go to top) Django中内置的signal Django中提供 ...

  3. redis之（五）redis的散列类型的命令

    ［一］赋值与取值 -->命令:HSET key field value   -->往某个key的某个属性设置值 -->命令:HGET key field   --> 获取某个k ...

  4. mysql 主从 同步原理及配置

    一.在mssql 里头实现同步镜像,只能主库用而镜像库不能同时用,而mysql 主从同步可以实现 数据库的读写分离,主库负责 update insert delete ,从库负责select 这样一来 ...

  5. Linux下文件属性

    在Linux下输入命令ls -l /etc/termcap /root/install.log,我们经常看到,这后面的一串内容具体是什么含义呢?[root@www ~]# ls -l /etc/ter ...

  6. npoi的基本操作

    ////自动换行               ////自动换行翻译成英文其实就是Wrap的意思,所以这里我们应该用WrapText属性,这是一个布尔属性               //style6. ...

  7. RadioGroup多行显示

    今天做一个单选框,效果如下: 使用原始的RadioGroup可以实现布局,但因为把6个单选分为两个LinearLayout,导致无法互斥,Google官方的做法是写两个RadioGroup,但是要动态 ...

  8. 设计模式-模板方法模式（the Template Method Pattern）

    本文由@呆代待殆原创,转载请注明出处:http://www.cnblogs.com/coffeeSS/ 模板方法模式简介 这是一个被用的相当广泛的一种设计模式,变体也特别多,他建立一个抽象类定义一个算 ...

  9. Python开发基础-Day19继承组合应用、对象序列化和反序列化，选课系统综合示例

    继承+组合应用示例 class Date: #定义时间类,包含姓名.年.月.日,用于返回生日 def __init__(self,name,year,mon,day): self.name = nam ...

  10. ubuntu16安装navicat字体显示不正常，显示方框以及字体倒立

    昨天遇到了这个问题,网上找了很多方法都没有真正解决这个问题. 目前其他博客论坛说的主要方法有 1)将安装目录下的./start_navicat中的字符集改为zh_CN.UTF-8 2)将系统的默认字符 ...