append

<p>
<span class="s1">s1</span>
</p>
<script>
$("p").append('<span class="s2">s2</span>');
</script>

结果是这样的:

<p>
<span class="s1">s1</span>
<span class="s2">s2</span>
</p>

after

<p>
<span class="s1">s1</span>
</p>
<script>
$("p").after('<span class="s2">s2</span>');
</script>

结果是这样的:

<p>
<span class="s1">s1</span>
</p>
<span class="s2">s2</span>

总结:

append/prepend 是在选择元素内部嵌入。

after/before 是在元素外面追加。

jquery的append/prepend和after/before有什么区别呢?的更多相关文章

  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的用法

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

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

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

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

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

  7. jquery中append、prepend, before和after方法的区别

    1.prepend() .append()方法在被选元素的开头/结尾插入文本/HTML: 2.before().after()方法在被选元素之前/之后插入内容: append() & prep ...

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

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

  9. javascrit原生实现jquery的append()函数

    /** * javascrit原生实现jquery的append()函数 * @param parent * @param text */ function append(parent, text) ...

随机推荐

  1. UVA 1329 Corporative Network【并查集】

    题目链接: https://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_proble ...

  2. CCControlExtension/CCControlPotentiometer

    #ifndef __CCCONTROLPOTENTIOMETER_H__ #define __CCCONTROLPOTENTIOMETER_H__ #include "CCControl.h ...

  3. 棋盘覆盖问题python3实现

    在2^k*2^k个方格组成的棋盘中,有一个方格被占用,用下图的4种L型骨牌覆盖全部棋盘上的其余全部方格,不能重叠. 代码例如以下: def chess(tr,tc,pr,pc,size): globa ...

  4. JAVA设计模式之【桥接模式】

    桥接模式 蜡笔中颜色和型号之间存在耦合 毛笔中,颜色和型号解耦了 如果软件系统中某个类存在两个独立变化的维度,桥接模式可以将两个维度分离出来 角色 抽象类 扩充抽象类 实现类接口 提供基本操作 抽象类 ...

  5. nyoj--1237--最大岛屿(dfs+数据处理)

    最大岛屿 时间限制:1000 ms  |  内存限制:65535 KB 难度: 描述 神秘的海洋,惊险的探险之路,打捞海底宝藏,激烈的海战,海盗劫富等等.加勒比海盗,你知道吧?杰克船长驾驶着自己的的战 ...

  6. 记录一下c++的一点指针所得

    c++有两种传值可以改变外部参数,一种是传递指针,另一种是传递引用,对于前者,可以用Ugly(but explicitly),对于后者,Clean(but hidden),在传递的时候有一种值得注意的 ...

  7. Java序列化注意事项

    当父类继承Serializeble接口时,所有子类可以被序列化 子类实现了Serializeble接口,父类没有,父类中的属性不能序列化(不报错,数据会丢失),但是在子类中属性仍能正确序列化 如果序列 ...

  8. 11.使用boostregex遭遇无法打开libboost_regex-vc120-mt-sgd-1_62.lib的问题

    通过Boost库可以在C++项目中使用正则表达式,配置好环境后链接过程出现”无法打开libboost_regex-vc120-mt-sgd-1_62.lib”的错误.  原因是按照官方生成lib的方法 ...

  9. xBIM 基础06 将STEP物理文件转换为XML

    系列目录    [已更新最新开发文章,点击查看详细]  一.STEP标准简介 STEP,它是Standard for the Exchange of Product model data的缩写.产品数 ...

  10. lucene简单使用demo

    测试结构目录: 1.索引库.分词器 Configuration.java package com.test.www.web.lucene; import java.io.File; import or ...