之前做项目对于这几个的方法总是有点模糊，尤其是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. SharpMap入门教程

    SharpMap是一个基于.NET Framework 4,采用C#开发的地图渲染引擎,非常易于使用.本教程针对SharpMap入门及开发,讲述如何基于SharpMap组件渲染Shapefile数据. ...

  2. vmware开发包之vSphere Management SDK

    vSphere Management SDK关于vmware管理等相关功能的.net和java的代码示例. 在其5.5的解压包中 eam:esx agent management表示esx虚机生产环境 ...

  3. MySQL数据库（三）

    1. 创建表 create table student( id int unsigned not null auto_increment primary key, name varchar(8) no ...

  4. controller 状态码

      工具使用lombok表示.如没有使用lombok 请 删除@Getter    @Setter  并给get set方法 调用方法: 类型使用 Status   --->    public ...

  5. CXF动态调用wsdl接口

    1.application.properties文件中配置接口url 2.工具类 package com.vulnverify.core.utils; import java.io.IOExcepti ...

  6. python 调试器

    pdb https://www.zhihu.com/question/21572891 https://zhuanlan.zhihu.com/p/43846098

  7. ajax 提交 json格式数据到后台

    例子:$.ajax({ type: 'POST', url: "/ROOT/modify.do", contentType: "application/json" ...

  8. IntelliJ IDEA 如何将一个 filename.java 文件直接运行

    IntelliJ IDEA 如何将一个 filename.java 文件直接运行 前言: ​ 出于考证需要,手头有许多 *.java 文件需要进行运行.然后出于对 JetBrains 全家桶的喜爱,选 ...

  9. ArchLinux 下文件描述符

    stderr -> /proc/self/fd/2 标准错误:2 stdin -> /proc/self/fd/0 标准输入:0 stdout -> /proc/self/fd/1 ...

  10. Intellig IDEA 搭建spring boot 热部署

    在pom中直接引入依赖 <dependency> <groupId>org.springframework.boot</groupId> <artifactI ...