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及阻止表单提交submit

    HTML代码: <td><input name="duration[]" value="" type="text" /&g ...

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

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

  5. jquery after append appendTo三个函数的区别

    jq文档的说明是 1.after函数 定义和用法: after() 方法在被选元素后插入指定的内容. 语法: $(selector).after(content) 实例: <html> & ...

  6. jQuery 添加元素和删除元素

    jQuery - 添加元素 append() - 在被选元素的结尾插入内容 prepend() - 在被选元素的开头插入内容 after() - 在被选元素之后插入内容 before() - 在被选元 ...

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

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

  8. jquery中append跟prepend的用法

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

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

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

随机推荐

  1. (九)pdf的构成之文件体(content属性)

    content属性简单当成一个流来处理 流内部属一个画笔,下面介绍画笔属性 文本对象: BT    文本开始 ET    文本结束   文本状态:       Tc    字符之间的距离       ...

  2. python代码执行SQL文件(逐句执行)

    一.简介 关于Python如何连接数据库并执行SQL语句,几乎所有的Python教程都会讲,教程里基本只介绍了执行单条SQL语句的方法,但是实际生产过程中可不只是执行一两条语句,动辄几十条甚至上百条的 ...

  3. 【leetcode-62,63,64 动态规划】 不同路径,最小路径和

    给定一个包含非负整数的 m x n 网格,请找出一条从左上角到右下角的路径,使得路径上的数字总和为最小. 说明:每次只能向下或者向右移动一步. 示例: 输入: [   [1,3,1], [1,5,1] ...

  4. python 工厂方法

    工厂方法模式(FACTORY METHOD)是一种常用创建型设计模式,此模式的核心精神是封装类中变化的部分,提取其中个性化善变的部分为独立类, 通过依赖注入以达到解耦.复用和方便后期维护拓展的目的. ...

  5. Vue编程式跳转

    编程式跳转 <template> <ul class = "prolist"> <!-- //产品 --> <!-- :to = &quo ...

  6. Java 之 ServletContext 对象

    ServletContext 对象 一.概念 ServletContext对象:代表整个 web 应用,可以和程序的容器(服务器)来通信. 二.获取 1.通过request 获取 方法: reques ...

  7. EXPORT_SYMBOL

    EXPORT_SYMBOL只出现在2.6内核中,在2.4内核默认的非static函数和变量都会自动导入到kernel 空间 作用 EXPORT_SYMBOL标签内定义的函数或者符号对全部内核代码公开, ...

  8. unity shader入门(四):高光

    高光反射计算公式(phong模型)Cspecular=(Clight*Mspecular)max(0,v*r)mgloss mgloss为材质的官泽度,也成反射度,控制高光区域亮点有多大 Mspecu ...

  9. xshell 连接出现 The remote SSH server rejected X11 forwarding request

    如果本文对你有用,请爱心点个赞,提高排名,帮助更多的人.谢谢大家!❤ yum install xorg-x11-xauth 同时sshd的config文件开启X11Forwarding yes vim ...

  10. React: JSX生成真实DOM结点

    在上一篇文章中,我们介绍了 Babel 是如何将 JSX 代码编译成可执行代码的,随后也实现了一个自己的解析器,模拟了 Babel 编译的过程. 现在我们再来回顾一下,假定有如下业务代码: const ...