append() 是在被选元素的结束标签前面(即改被选元素的内部)插入指定内容。
after() 是在被选元素的结束标签后面(即该被选元素的外部)插入指定的内容。
appendTo() 仍然是在被选元素的结束标签前面(即改被选元素的内部)插入指定内容,只不过是jQuery函数的写法不太相同。
pretend()和before()的区别与append()和after()的区别是一样的,略。

分析用的源码:

  1. <!DOCTYPE html>
  2. <html>
  3. <head lang="en">
  4. <meta charset="UTF-8">
  5. <title></title>
  6. <script src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
  7. <script type="text/javascript">
  8. $().ready(function(){
  9. $("#button1").click(function(){
  10. $("span").append('<a href="#">append方法</a>');
  11. })
  12. $("#button2").click(function(){
  13. $("span").after('<a href="#">after方法</a>');
  14. })
  15. $("#button3").click(function(){;
  16. $('<a href="#">appendTo方法</a>').appendTo("span");
  17. })
  18. })
  19. </script>
  20. </head>
  21. <body>
  22. <span>JQuery的append、after、appendTo、pretend、before方法的区别</span>
  23. <button id="button1">append</button>
  24. <button id="button2">after</button>
  25. <button id="button3">appendTo</button>
  26. <p>要想看出区别,请F12看源码,右击不行</p>
  27. </body>
  28. </html>

Jquery基础:append、prepend、after、before、appendTo的区别的更多相关文章

  1. jQuery中append(),prepend()与after(),before()的区别

    在jQuery中,添加元素有append(),prepend和 after(),before()两种共四个. 根据字面意思我们可以看出他们分别是追加,添加和之前,之后,意思相近.同时他们又都有添加元素 ...

  2. (转)jQuery中append(),prepend()与after(),before()的区别

    在jQuery中,添加元素有append(),prepend和 after(),before()两种共四个. 根据字面意思我们可以看出他们分别是追加,添加和之前,之后,意思相近.同时他们又都有添加元素 ...

  3. jQuery - 添加元素append/prepend和after/before的区别

    append <p> <span class="s1">s1</span> </p> <script> $(" ...

  4. jquery的append/prepend和after/before有什么区别呢?

    append <p> <span class="s1">s1</span> </p> <script> $(" ...

  5. jQuery基础系列

    $(document).ready(function(){ $("p").click(function(){ $(this).hide(); }); }); jQuery 入口函数 ...

  6. jQuery基础(DOM篇,append(),after(),prepend(),insertAfter(),节点删除,遍历方法each())

    1.DOM创建节点及节点属性   创建流程比较简单,大体如下:   - 创建节点(常见的:元素.属性和文本) - 添加节点的一些属性 - 加入到文档中   流程中涉及的一点方法:   - 创建元素:d ...

  7. jquery中append跟prepend的用法

    jquery中append和prepend的用法 append   是插入到元素中,并放到元素内的最后面prepend  是插入到元素中,并放到元素内的最前面例$("body"). ...

  8. jQuery中append()与appendto()用法分析

    本文实例分析了jquery中append()与appendto()的用法.分享给大家供大家参考.具体分析如下: 在jQuery的文档操作方法中,append()和appentto()方法执行的任务相同 ...

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

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

随机推荐

  1. T-SQL备忘(2):聚合函数运算和NULL

    我们看表的数据: 而select AVG(Age) from Member1的结果为27.自己算一下就知道136/6 =22.666.而不是27,因此知道实际上Age为NULL的行没有参与运算.即: ...

  2. 实验室 Linux 集群的管理常用命令

    实验室有一个Linux集群,本文做一下记录. SSH相关命令 通过SSH登录集群中的其他机器上的操作系统(或虚拟机中的操作系统).操作系统之间已经设置免密码登录. 1. 无选项参数运行 SSH 通常使 ...

  3. Levenshtein Distance (编辑距离) 算法详解

    编辑距离即从一个字符串变换到另一个字符串所需要的最少变化操作步骤(以字符为单位,如son到sun,s不用变,将o->s,n不用变,故操作步骤为1). 为了得到编辑距离,我们画一张二维表来理解,以 ...

  4. Oracle数据库中有关记录个数的查询

    一.查询表中全部的记录个数 可用两种方法,一种是在oracle的系统表中统计,另一种需要写存储过程统计,方法分别如下. 1.系统表中统计: SELECT sum(num_rows) FROM user ...

  5. C# "error CS1729: 'XXClass' does not contain a constructor that takes 0 arguments"的解决方案

    出现这种错误的原因时,没有在子类的构造函数中指出仅有带参构造函数的父类的构造参数. 具体来讲就是: 当子类要重用父类的构造函数时, C# 语法通常会在子类构造函数后面调用 : base( para_t ...

  6. android 性能优化大纲

    性能优化系列 分为三个部分:视图篇 逻辑篇  和代码规范篇 . ------2016/9/6  视图篇      主要涵盖视图树层级优化.自定义视图.图片优化,常用布局性能缺陷等多个方面 .把平常经常 ...

  7. java PO、BO

    PO(persistent object) 持久对象 在o/r映射的时候出现的概念,如果没有o/r映射,那么这个概念也就不存在了.通常对应数据模型(数据库),本身还有部分业务逻辑的处理.可以看成是与数 ...

  8. 【LeetCode】169 - Majority Element

    Given an array of size n, find the majority element. The majority element is the element that appear ...

  9. WS之cxf的权限拦截器应用

    一.服务器端: 1.权限判断: package cn.tdtk.ws.interceptor; import java.util.List; import org.apache.cxf.binding ...

  10. 通过ajax提交form表单

    $.ajax({ url : 'deliveryWarrant/update.do', data : $('#myform').serialize(), type : "POST" ...