之前做项目对于这几个的方法总是有点模糊，尤其是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. BZOJ 1977 严格次小生成树

    小C最近学了很多最小生成树的算法,Prim算法.Kurskal算法.消圈算法等等.正当小C洋洋得意之时,小P又来泼小C冷水了.小P说,让小C求出一个无向图的次小生成树,而且这个次小生成树还得是严格次小 ...

  2. eclipse可以调试但是无法打开网页，提示一直在加载

    工作过程中遇到了eclipse调试可以正常执行,也没有报错,但是通过浏览器打开网页就是打不开,还提示一直加载.这个问题找了很多网页和搜索引擎,大多数的方法就是重新配置elipse里的tomcat的we ...

  3. [LeetCode 题解]： First Missing Positive

    Given an unsorted integer array, find the first missing positive integer. For example,Given [1,2,0]  ...

  4. C++视频教程学习笔记

    1. 命名空间 用于解决命名冲突的问题 里面可以放函数.变量.结构体.类 可以嵌套 必须定义在全局作用域下 是开放的,可以随时往原先的命名空间中追加内容,而不是覆盖 实现命名空间下的函数和调用时,需要 ...

  5. 如何快速解决myeclipse中导入jquery文件的报错。

    如何快速解决myeclipse中导入jquery文件的报错. 解决: 选中错误的文件, 点击右键, 选中myeclipse,点击Exclude From Validation.

  6. XSSFWorkbook实现导出excel

    1.pom.xml中加入poi依赖: <!-- poi -->        <dependency>            <groupId>org.apache ...

  7. 【sonar-block】Use try-with-resources or close this "BufferedInputStream" in a "finally" clause.

    自己的理解: try-with-resources是JDK7的新语法结构,主要功能是自动关闭资源而不需要在finally里面手动close()关闭, 而且最重要的是,try块中的异常不会被close( ...

  8. bzoj 3669: [Noi2014]魔法森林（并查集+LCT）

    Description 为了得到书法大家的真传,小E同学下定决心去拜访住在魔法森林中的隐士.魔法森林可以被看成一个包含个N节点M条边的无向图,节点标号为1..N,边标号为1..M.初始时小E同学在号节 ...

  9. 使用Ajax、json实现京东购物车结算界面的数据交互

    <div class="goodsList_menu"> <div class="goodsList"> <div class=& ...

  10. 如何在Linux下禁用IPv6

    如何在Linux下禁用IPv6 echo 1 > /proc/sys/net/ipv6/conf/all/disable_ipv6                            禁用IP ...