之前做项目对于这几个的方法总是有点模糊，尤其是prepend和prependTo;

1.append

<style>

    span{

        background:yellow;

    }

    .test{

        background:#ccc;

        height:50px;

    }

    .test_1{

        background:red;

    }

</style>

<body>

    <div class="test"><span class="test_1">我就站在这里</span></div>

</body>

<script>

    $('.test').append("<span>我是测试快</span>");

</script>

append是插入元素内部的后面

2.appendTo

$('<span>我是测试快</span>').appendTo($('.test'));

和上面产生一样的效果，就是写法换了一下

3.prepend

$('.test').prepend("<span>我是测试快</span>");

这个方法和append做对比

append是插入元素内部的后面，而prepend是插入元素内部的最前面

4.prependTo

$('<span>我是测试快</span>').prependTo($('.test'));

上面的效果和prepend中的效果一样

关于append，appendTo,prepend,prependTo的区别的更多相关文章

  1. jQuery中append appendTo prepend prependTo insertBefore insertAfter after before之间的区别

    jQuery中有一个很关键的元素操作,他们的使用方法都一样,但是呈现的结果有所不同. <!DOCTYPE html> <html lang="en"> &l ...

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

    转载 未曾见海  https://www.cnblogs.com/afei-qwerty/p/6682963.html 在jQuery中,添加元素有append(),prepend() 和 after ...

  3. jq中append()、prepend()、after()、before()的区别

    jq中append().prepend().after().before()的区别详解 .append() - 在被选元素的结尾插入内容(内容的结尾,比如说有个a标签,则是在</a>这个标 ...

  4. JavaScript 中 append()、prepend()、after()、before() 的区别

    内容 append().prepend().after().before() 的区别 jQuery 操作 DOM 之添加节点 方法名 作用 $(selector).append() 指定元素内部添加, ...

  5. JQuery中after() append() appendTo()的区别

    首先 after() 是追加在元素外边而append() appendTo()是追加在元素里面. $(selector).after(content) $("span").afte ...

  6. jquery中append、prepend, before和after方法的区别（一）

    原文:http://blog.csdn.net/woosido123/article/details/64439490 在 jquery中append() 与 prepend()是在元素内插入内容(该 ...

  7. jQuery之设置元素内容(移动和复制元素,使用append(),appendTo()方法)

    jQuery之设置元素内容(移动和复制元素,使用append(),appendTo()方法) ---------- 如果想把内容添加到现有内容末尾,可以利用append()命令.append()命令语 ...

  8. 比较jquery中的after(),append(),appendTo()方法

    html页面: <p id="myp1">我的兴趣爱好是:</p> <button id="b1">after函数</ ...

  9. 添加新内容的四个 jQuery 方法：append，prepend，after，before

    添加新内容的四个 jQuery 方法区别如下: append() - 在被选元素(里面)的结尾插入内容prepend() - 在被选元素(里面)的开头插入内容 //jQuery append() 方法 ...

随机推荐

  1. 虚拟化技术KVM

    1>虚拟化技术: 计算机虚拟化技术是多种技术的综合实现,它包括硬件平台,操作系统,存储以及网络等,简单地说,虚拟化技术就是在单台主机上可以虚拟多个虚假主机,并可以在这些虚拟主机上运行不同的操作系 ...

  2. Python下载网页图片

    有时候不如不想输入路径,那就需要用os模块来修改当前路径 下面是从其他地方看到的一个例子,就是把图片url中的图片名字修改,然后就可以循环保存了,不过也是先确定了某个url 来源:http://www ...

  3. RabbitMQ.Bus

    一个.netcore下的,十分简单的rabbitmq封装,基于RabbitMQ.Client Nuget https://www.nuget.org/packages/RabbitMQ.Bus/ ht ...

  4. HBase介绍(3)---框架结构及流程

    HBASE依托于Hadoop的HDFS作为存储基础,因此结构也很类似于Hadoop的Master-Slave模式,Hbase Master Server 负责管理所有的HRegion Server,但 ...

  5. 一个简单的C#+arcgis的非数据库版例子

    1.首先新建一个winform的项目. 2.确保C#工具箱包含ESRI的相关控件,如果没有就需要安装SDK. 如果VS中依旧不存在esri控件解决方案如下,以VS2013为例: (1)打开注册表,定位 ...

  6. 反射：获取Class对象的三种方式

    获取Class对象的三种方式 package lianxiApril18; /** * 获取Class对象的三种方式 * 1 Object ——> getClass(); * 2 任何数据类型( ...

  7. 比较旧的写法：验证车牌、手机号、电话、qq等

    1.验证车牌代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  8. Servlet实现禁用cookie重写URL获取session

    前言 一个女人让他的程序员丈夫去商店买东西:你去附近的商店买些鸡蛋,如果有香蕉的话,买8个回来,这个丈夫买了8个鸡蛋回来,他的妻子大吃一惊:你为什么买了8个鸡蛋?! 程序员丈夫回答:因为他们有香蕉. ...

  9. php生成N个不重复的随机数实例

    思路: 将随机数存入数组,再在数组中去除重复的值,即可生成一定数量的不重复随机数. /* * array unique_rand( int $min, int $max, int $num ) * 生 ...

  10. 【maven】maven 子项目如何使用父项目的jar包

    如果父pom中使用的是 <dependencies>....</dependencies> 方式, 则子pom会自动使用pom中的jar包 如果父pom使用 <depen ...