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) ...
随机推荐
- python中各种转义字符
转义字符 描述 \(在行尾时) 续行符 \\ 反斜杠符号 \’ 单引号 \” 双引号 \a 响铃 \b 退格(Backspace) \e 转义 \000 空 \n 换行 \v 纵向制表符 \t 横向制 ...
- C语言中typedef的解释_1
typedef是在计算机编程语言中用来为复杂的声明定义简单的别名,它与宏定义有些差异. 它本身是一种存储类的关键字,与auto.extern.mutable.static.register等关键字不能 ...
- PowerShell命令部署WSP
转载:http://www.cnblogs.com/ChunLiangZhang/archive/2012/07/18/2597335.html(作者:ChunLiang) 现在可以用SharePoi ...
- Codeforces Round #316 (Div. 2) A
Description The country of Byalechinsk is running elections involving n candidates. The country cons ...
- SQL全文搜索引擎 Sphinx
Sphinx是一个基于SQL的全文检索引擎,可以结合MySQL,PostgreSQL做全文搜索, 它可以提供比数据库本身更专业的搜索功能,使得应用程序更容易实现专业化的全文检索. Sphinx特别 ...
- SQL Connect By 的例子
看到一个较为通俗易懂的connect by的例子,是百度知道的答案,稍微整理了一下.我自己这样理解:connect by prior "id" = "p_id" ...
- Spring Boot学习资料汇总
1. SpringFramework 重点学习 IOC容器,Web MVC framework,AOP 等 官网文档 http://docs.spring.io/spring/docs/cur ...
- EF上下文容器,保存线程唯一性
在工作中有个疑问,就是EF上下文容器到底创建了多少个? 在asp.net中,EF上下文容器.如果只要有一个,则每次一个用户访问,添加一些实体,然后又不会自动销毁,就会造成内存爆炸.如果每次创建一个,则 ...
- js Form表单转json格式,及后台接收(多种方法)
转载:https://blog.csdn.net/qq_40138785/article/details/81533015 一.serialize()方法格式:var data = $("# ...
- oracle service name connect
oracle service name connect dest_ip=100.100.100.100 dest_port= dest_dbname=server_name connect=" ...