jQuery-prepend、append、before、after的区别
举例说明,原始html代码如下:
<ol>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
</ol>
1、prepend(在被选元素的开头插入元素)
$("ol").prepend("<li>Prepend item</li>");
得到:
<ol>
<li>Prepend item</li>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
</ol>
2、append(在被选元素的结尾插入元素)
$("ol").append("<li>Append item</li>");
得到:
<ol>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
<li>Append item</li>
</ol>
3、before(在被选元素之前插入内容)
$("ol").before("<b>Before</b>");
得到:
<b>Before</b>
<ol>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
</ol>
4、after(在被选元素之后插入内容)
$("ol").after("<i>After</i>");
得到:
<ol>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
</ol>
<i>After</i>
jQuery-prepend、append、before、after的区别的更多相关文章
- JQuery之append和appendTo的区别,还有js中的appendChild用法
JQuery之append和appendTo的区别 append()前面是要选择的对象,后面是要在对象内插入的元素内容 appendTo()前面是要插入的元素内容且为Jquery对象,而后面是要选择的 ...
- jQuery parent.append和$after的区别
首先假设我们有个id为test的div和一个id为test2的div: <div id="test"> 我是测试div </div> <div ...
- jQuery中append()与appendTo()方法区别
1. append(content)方法 方法作用:向每个匹配的元素内部追加内容. 参数介绍:content (<Content>): 要追加到目标中的内容. 用法示例: HTML代码为& ...
- jquery中 append 和appendto的区别
1. append(content)方法 方法作用:向每个匹配的元素内部追加内容. 参数介绍:content (<Content>): 要追加到目标中的内容. 用法示例: HTML代码为& ...
- jquery中append与appendTo方法区别
1. append(content)方法 方法作用:向每个匹配的元素内部追加内容. 参数介绍:content (<Content>): 要追加到目标中的内容. 用法示例: HTML代码为& ...
- jquery中append、prepend, before和after方法的区别(一)
原文:http://blog.csdn.net/woosido123/article/details/64439490 在 jquery中append() 与 prepend()是在元素内插入内容(该 ...
- jquery中append跟prepend的用法
jquery中append和prepend的用法 append 是插入到元素中,并放到元素内的最后面prepend 是插入到元素中,并放到元素内的最前面例$("body"). ...
- before(),after(),prepend(),append()等新DOM方法简介
一.DOM API也在不断升级 web前端标准一直在不断升级,比方说,说了很多年的HTML5.CSS3,以及天天见的ES6. 然后,似乎就没有然后了.实际上,除了HTML5/CSS3/ES6+,关于D ...
- jQuery中append()与appendto()用法分析
本文实例分析了jquery中append()与appendto()的用法.分享给大家供大家参考.具体分析如下: 在jQuery的文档操作方法中,append()和appentto()方法执行的任务相同 ...
- javascrit原生实现jquery的append()函数
/** * javascrit原生实现jquery的append()函数 * @param parent * @param text */ function append(parent, text) ...
随机推荐
- Django工程创建
方法一: 1.win+r进入cmd命令窗口: 2.找到Django的安装地址: 3.cmd窗口中利用cd 进入相应的文件夹,再输入命令如下: django-admin.exe startproject ...
- sublime 显示 python 错误信息
默认的编译器可以直接按Ctrl+B编译运行Python,并在控制台输出结果.美中不足的是无法输出中文,需要自己手动配置一番. 在Sublime Text 3 中依次点击菜单Tools->buil ...
- 使用nexus 搭建本地 maven 服务器
1.下载安装nexus oos https://www.sonatype.com/download-oss-sonatype ,选择2.x 版本. 2. 配置maven <server> ...
- JAVA第一个程序hello world
import java.util.Scanner; public class hello { public static void main(String[] args) { System.out.p ...
- Spring Boot中JPA如何实现按日期合计
1. 用queryDsl方法 JPAQueryFactory.select( Projections.fields(OrderCountByDayBean.class, qOrder.amount.s ...
- webAPI过滤器添加参数签名
项目需求: 接口对安卓和IOS开发接口,需要房子用户窜改数据请求接口.添加sign签名校验参数. 代码如下:加上特性标签就可以控制部分接口验证 public class SignAuthorizeFi ...
- Java升级替换java version "1.5.0"
首先进行java安装 http://www.cnblogs.com/someone9/p/8670585.html 2. 然后查看版本信息,仍然是1.5.0 [root@OKC java]# java ...
- 转载 Some indexes or index [sub]partitions of table VAS.TAB_PUB_CALLLOG have been marked unusable
http://www.xifenfei.com/2011/12/some-indexes-or-index-subpartitions-of-table-vas-tab_pub_calllog-hav ...
- ORA-12012 ORA-20001 on ORACLE 12C (2420581.1)
Oracle数据库 - 企业版 - 12.2.0.1及更高版本本文档中的信息适用于任何平台. Doc ID 2420581.1 症状 在容器数据库中,警报日志中会显示以下错误: ORA-12012 ...
- vue--钩子函数1
最近在学习自定义指令,这里做个整理 vue允许注册自定义指令,在2.0中,代码复用和抽象的主要形式是组件.然而有的情况下仍需要对普通DOM元素进行底层操作,这时就会用到自定义指令. 全局指令direc ...