关于append,appendTo,prepend,prependTo的区别
之前做项目对于这几个的方法总是有点模糊,尤其是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的区别的更多相关文章
- jQuery中append appendTo prepend prependTo insertBefore insertAfter after before之间的区别
jQuery中有一个很关键的元素操作,他们的使用方法都一样,但是呈现的结果有所不同. <!DOCTYPE html> <html lang="en"> &l ...
- jQuery中append()、prepend()与after()、before()的区别
转载 未曾见海 https://www.cnblogs.com/afei-qwerty/p/6682963.html 在jQuery中,添加元素有append(),prepend() 和 after ...
- jq中append()、prepend()、after()、before()的区别
jq中append().prepend().after().before()的区别详解 .append() - 在被选元素的结尾插入内容(内容的结尾,比如说有个a标签,则是在</a>这个标 ...
- JavaScript 中 append()、prepend()、after()、before() 的区别
内容 append().prepend().after().before() 的区别 jQuery 操作 DOM 之添加节点 方法名 作用 $(selector).append() 指定元素内部添加, ...
- JQuery中after() append() appendTo()的区别
首先 after() 是追加在元素外边而append() appendTo()是追加在元素里面. $(selector).after(content) $("span").afte ...
- jquery中append、prepend, before和after方法的区别(一)
原文:http://blog.csdn.net/woosido123/article/details/64439490 在 jquery中append() 与 prepend()是在元素内插入内容(该 ...
- jQuery之设置元素内容(移动和复制元素,使用append(),appendTo()方法)
jQuery之设置元素内容(移动和复制元素,使用append(),appendTo()方法) ---------- 如果想把内容添加到现有内容末尾,可以利用append()命令.append()命令语 ...
- 比较jquery中的after(),append(),appendTo()方法
html页面: <p id="myp1">我的兴趣爱好是:</p> <button id="b1">after函数</ ...
- 添加新内容的四个 jQuery 方法:append,prepend,after,before
添加新内容的四个 jQuery 方法区别如下: append() - 在被选元素(里面)的结尾插入内容prepend() - 在被选元素(里面)的开头插入内容 //jQuery append() 方法 ...
随机推荐
- http-bio-8080"-exec-6
现象如下: Tomcat7启动后,后台抛出如下异常,前台一直无法登陆 Exception in thread ""http-bio-8080"-exec-6&qu ...
- 15、Semantic-UI之导航
15.1 面包屑导航 在Semantic-UI中有多种样式实现面包屑导航,类似 / > 等. 示例:定义定义基础面包屑导航 <div class="ui container& ...
- C++-结构体,联合体,枚举,的区别
结构体: struct NUM { int number; }a; 结构体是声明只是一个模型,没有分配内存空间.当进行定义结构体变量后才分配内存空间 联合体: union data { int a ...
- DELPHI XE5/6/7 android 无线真机调试
一.下载adbWireless 地址:http://sj.zol.com.cn/detail/41/40834.shtml 安装,需要ROOT权限. 运adbWireless.界面很简单,就一个大按钮 ...
- vmware虚拟机监控数据
在vsphere产品中内建一个监控所有虚机包括主机资源的插件,叫做vcenter servcie status,这个插件的主要功能是记录当前虚拟机资源的cpu.硬盘.内存和网络等相关信息.通过它可以查 ...
- How can i use iptables on centos 7 or fedora?
http://stackoverflow.com/questions/24756240/how-can-i-use-iptables-on-centos-7 # sudo service iptabl ...
- MVC ASP.NET MVC5使用Area区域
MVC ASP.NET MVC5使用Area区域 一.为什么要使用area? 在大型的ASP.NET mvc5项目中一般都有许多个功能模块,这些功能模块可以用Area(中文翻译为区域)把它们分离开来 ...
- 「HNOI 2013」消毒
题目链接 戳我 \(Solution\) 我们首先想一想如果这一题只是二维的该怎么办? 就是一个最小点覆盖问题.这里就不详细解释了,用网络流或匈牙利都无所谓. 但现在是三维的,那么现在该如何处理呢? ...
- HAOI2010 订货
题目链接:戳我 费用流. 将每天分成早上和晚上两个点.源点向早上连容量INF,费用为进货量的边.早上向汇点连容量供货量,费用0.早上向晚上连容量为S,费用为0的边.晚上向第二天早上连容量S,费用0.之 ...
- oracle ocp题库变化,052最新考试题及答案整理-30
30.Which is true when a database instance is shut down? A. Only transactional and normal modes wait ...