after、append和appendTo三个函数的区别
jq文档的说明是
1、after函数
定义和用法:
after() 方法在被选元素后插入指定的内容。
语法:
$(selector).after(content)
实例:
<html>
<head>
<script type="text/JavaScript" src="/jQuery/jquery.js"></script>
<script type="text/javascript">
$().ready(function(){
$("button").click(function(){
$("span").after("<a href="#">ddddd</a>")
})
})
</script>
</head>
<body>
<span>aaaaaaaaaaaaaaa</span>
<button>after函数</button>
</body>
</html>
结果如下:
<span>aaaaaaaaaaaaaaa</span>
<a href="#">ddddd</a>
span标签后面多了一个a标签
2、append函数
定义和用法:
append() 方法在被选元素的结尾(仍然在内部)插入指定内容。
语法:
$(selector).append(content)
实例:
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$().ready(function(){
$("button").click(function(){
$("span").append("<a href="#">ddddd</a>")
})
})
</script>
</head>
<body>
<span>aaaaaaaaaaaaaaa</span>
<button>after函数</button>
</body>
</html>
结果如下:
<span>aaaaaaaaaaaaaaa<a href="#">ddddd</a></span>
span标签里面多了一个a标签
3、appendTo函数
定义和用法:
appendTo() 方法在被选元素的结尾(仍然在内部)插入指定内容。
语法:
$(content).appendTo(selector)实例:
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$().ready(function(){
$("button").click(function(){
// $("span").appendTo("<a href="#">ddddd</a>"),这样的写法是不正确的
$("<a href="#">ddddd</a>").appendTo("span")
})
})
</script>
</head>
<body>
<span>aaaaaaaaaaaaaaa</span>
<button>after函数</button>
</body>
</html>
结果如下:
<span>aaaaaaaaaaaaaaa<a href="#">ddddd</a></span>
span标签里面多了一个a标签
效果和append函数是一样,只不过它们的写法是反着来写的而已
备注:before函数与after函数相反,表示是元素的前面加入指定元素
after、append和appendTo三个函数的区别的更多相关文章
- jquery after append appendTo三个函数的区别
jq文档的说明是 1.after函数 定义和用法: after() 方法在被选元素后插入指定的内容. 语法: $(selector).after(content) 实例: <html> & ...
- jquery:after append appendTo三个函数的区别
1.查找元素节点 var $li = $(“ul li:eq(0)”);//获取ul标记下的第一个li,也可以写成 $(“#ulID li:eq(0)”); 2.查找元素属性 利用jq ...
- jq查找父类元素三个函数的区别
parent是找当前元素的第一个父节点,parents是找当前元素的所有父节点 parent().parents()与closest()方法两两之间有类似又有不同,本篇简短的区分一下这三个方法.通过本 ...
- array_map、array_walk、array_filter三个函数的区别
array_walk --- 使自定的函数能处理数组的每个元素 bool array_walk ( array &array, callback funcname [, mixed userd ...
- TransparentBlt、StretchBlt与BitBlt三个函数的区别
jackyhwei 发布于 2011-10-13 10:55 点击:1080次 来自:blog.csdn.net/weiqubo BOOL StretchBlt( int x, //指定目的矩形区域 ...
- 【iOS开发之C语言】sprintf,strncpy,strcmp三个函数的区别
strncpy 这个函数用于将源字符串的内容拷贝到目标字符串,会覆盖掉目标字符串的之前内容 ] = "love"; char str2[] = "cool"; ...
- Javascript Math ceil()、floor()、round()三个函数的区别
Round是四舍五入的...Ceiling是向上取整..float是向下取整. ceil():将小数部分一律向整数部分进位. 如: Math.ceil(12.2)//返回13 Math.ceil(12 ...
- Oracle中NVL、NVL2、NULLIF 三个函数的区别?
首先说明:NULL指的是空值,或者非法值. 1.NVL (expr1, expr2)expr1为NULL,返回expr2:不为NULL,返回expr1.注意两者的类型要一致 2.NVL2 (expr1 ...
- 【笔记】jquery append,appendTo,prepend,prependTo 介绍
在jquery权威指南里面学习到这一章,很有必要介绍一下里面的内容: 首先是append(content)这个函数: 意思是将内容content加入到所选择的对象内容的后面 例如:$("di ...
随机推荐
- 2.Spark Streaming运行机制和架构
1 解密Spark Streaming运行机制 上节课我们谈到了技术界的寻龙点穴.这就像过去的风水一样,每个领域都有自己的龙脉,Spark就是龙脉之所在,它的龙穴或者关键点就是SparkStreami ...
- Win7 + VirtualBox + CentOS(无桌面), 扩容
http://www.2cto.com/os/201401/269730.html 对于目前的网络开发者来说,比较好的搭档就是Win7+VirtualBox+CentOS的组合,既可以发挥Linux强 ...
- Linux操作命令(三)
本次实验将介绍 Linux 命令中 more.less.head.tail 命令的用法. more less head tail 1.more ·more功能类似cat,cat命令是将整个文件的内容从 ...
- zabbix主机自动发现
环境说明 角色 主机名 IP zabbix-server c1.heboan.com 192.168.88.1 zabbix-agent c2.heboan.com 192.168.88.2 zabb ...
- RabbitMQ (十四) 普通集群
上篇文章把单机集群搭建好了,可以开始验证普通集群的相关功能了. 我们首先在管理后台(15672,15673 都可以)添加一个用户,并用新用户登录,添加一个虚拟主机 由于是在一台机器上模拟集群,所以我们 ...
- Spring的安全机制
Spring Security:它提供全面的安全性解决方案,同时在Web请求和方法调用处理身份确认和授权,利用依赖注入和aop技术.主要名词: 1,安全拦截器:相当应用的一把锁,能够阻止对应用程序中保 ...
- Visual Studio 2017启动x86的Android模拟器失败
Visual Studio 2017启动x86的Android模拟器失败 Visual Studio 2017默认提供多个Android模拟器.其中,x86模拟器运行较快.但是由于和Hyper-V服 ...
- SqlHelper——只因为在人群中多看了你一眼
对SQLHelper,还是有一点陌生的,但是大多数人都在使用,我就有一种想了解并使用的意愿,于是查了很多资料,发现一片不错的博客,放在下面,作为自己或读者使用的材料. 一.SqlHelper 出场 不 ...
- VB程序打包方法之如何在发布安装之后不带源码
很久之前,我发表了一片博客是VB程序如何打包,在那里面我总结了两个方法.有兴趣可以看看我的这篇博客http://blog.csdn.net/lu930124/article/details/88467 ...
- [转]解析UML建模语言中的UML图分类、 UML各种图形及作用
本文向大家介绍一下UML图分类,作为一种建模语言,UML的定义包括UML语义和UML表示法两个部分. UML图大致可分为五类,共有九种图形. AD: 本文和大家重点讨论一下UML图分类,标准建模语言U ...