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 ...
随机推荐
- rabbitmq在centos7下安装
知识预览 一. RabbitMQ队列 二. 事例 三.基于RabbitMQ的RPC 回到顶部 一. RabbitMQ队列 ? 1 2 3 4 5 #消息中间件 -消息队列 - 异步 提交的任务不需 ...
- linux系统使用过程遇到的bug
使用windows与ubuntu双系统,重装windows系统后需要修复ubuntu grub reference ubuntu系统中挂载的windows硬盘点不开 需要重新挂载 reference ...
- BZOJ 1901: Zju2112 Dynamic Rankings 区间k大 带修改 在线 线段树套平衡树
之前写线段树套splay数组版..写了6.2k..然后弃疗了.现在发现还是很水的..嘎嘎.. zju过不了,超时. upd:才发现zju是多组数据..TLE一版才发现.然后改了,MLE...手写内存池 ...
- Docker for Windows 里的Shared Drives 设置不生效
原文地址:传送门 问题描述:Docker中的settings里的Shared Drives 选择对应盘符后,点击Apply后无法生效,没办法选择对应盘符进行分享. 解决办法:win+R ,键入gped ...
- php smtp发送邮件功能
<?php header("Content-Type: text/html; charset=utf-8"); class smtp { /* Public Variable ...
- WCF+Windows2008&&sqlserver2008
这些在我的文件和云盘当中也可以在csdn中查找
- Bootstrap Table相关参数及属性、方法
http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/#%E4%BA%8B%E4%BB%B6
- 微信JSSDK分享功能实现
<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script> <scri ...
- 633. Sum of Square Numbers【Easy】【双指针-是否存在两个数的平方和等于给定目标值】
Given a non-negative integer c, your task is to decide whether there're two integers a and bsuch tha ...
- HDU 1561 The more, The Better【树形DP/有依赖的分组背包】
ACboy很喜欢玩一种战略游戏,在一个地图上,有N座城堡,每座城堡都有一定的宝物,在每次游戏中ACboy允许攻克M个城堡并获得里面的宝物.但由于地理位置原因,有些城堡不能直接攻克,要攻克这些城堡必须先 ...