【笔记】jquery append,appendTo,prepend,prependTo 介绍

在jquery权威指南里面学习到这一章,很有必要介绍一下里面的内容:
首先是append(content)这个函数:
意思是将内容content加入到所选择的对象内容的后面
例如:$("div").append("<p>" + hello + "</p>");
意为在所有div元素里面添加一个p标签,标签内容为hello,如果div元素里面有其他的内容则在原来的内容后面添加新的内容
然后是appendTo(content)这个函数:
由To这个单词我们便可得知这个函数的意思就是将什么加到什么中所以它和append()函数最大的区别就是:
内容和选择器的位置,以及 append() 能够使用函数来附加内容。而他们执行的任务都是一样的
就如上面的例子:
$("div").append("<p>" + hello + "</p>");将p标签加入到页面所有div中
如果用appendTo就应该这样写:
$("<p>" + hello + "</p>").appendTo("div")
append还有另外一个形态
append(function(index,html){})
用法和原来的append是一样的执行的任务也是一样,但是function里面的index和html不要理所当然的以为是在第index个div下插入html内容,其实这两个参数只是用来返回当前对象的索引值以及原始的内容
jquery代码
$(function() {
$("div").append(function(n,m){
return "hello" + "索引值:" + n + "原始内容:" + m;
});
})
html代码
<p>hello</p>
<div>jQuery 1</div>
<div>jQuery 2</div>
<div>jQuery 3</div>
<div>jQuery 4</div>
浏览器结果:

而prepend和prependTo的的用法和append,appendTo的用法是一样的,只不过prepend和prependTo是在选中的对象内容的前面添加新内容
【笔记】jquery append,appendTo,prepend,prependTo 介绍的更多相关文章
- jQuery中append appendTo prepend prependTo insertBefore insertAfter after before之间的区别
jQuery中有一个很关键的元素操作,他们的使用方法都一样,但是呈现的结果有所不同. <!DOCTYPE html> <html lang="en"> &l ...
- jquery append、prepend、before等等
1.jQuery append() 方法 jQuery append() 方法在被选元素的结尾插入内容. 实例 复制代码代码如下: $("p").append("Some ...
- 关于append,appendTo,prepend,prependTo的区别
之前做项目对于这几个的方法总是有点模糊,尤其是prepend和prependTo; 1.append <style> span{ background:yellow; } .test{ b ...
- after()和append()的区别、before()和prepend()区别、appendTo()和prependTo()、insertAfter()和insertBefore()
一.after()和before()方法的区别 after()——其方法是将方法里面的参数添加到jquery对象后面去: 如:A.after(B)的意思是将B放到A后面去: before( ...
- jQuery之设置元素内容(移动和复制元素,使用append(),appendTo()方法)
jQuery之设置元素内容(移动和复制元素,使用append(),appendTo()方法) ---------- 如果想把内容添加到现有内容末尾,可以利用append()命令.append()命令语 ...
- jquery:after append appendTo三个函数的区别
1.查找元素节点 var $li = $(“ul li:eq(0)”);//获取ul标记下的第一个li,也可以写成 $(“#ulID li:eq(0)”); 2.查找元素属性 利用jq ...
- jQuery 文档操作 - prependTo() ,appendTo()方法
其他jquery文档操作方法:http://www.w3school.com.cn/jquery/jquery_ref_manipulation.asp jQuery 参考手册 - 文档操作 appe ...
- jQuery 追加元素的方法如append、prepend、before,after(转)
1.jQuery append() 方法 jQuery append() 方法在被选元素的结尾插入内容. 实例 复制代码代码如下: $("p").append("Some ...
- jquery中append跟prepend的用法
jquery中append和prepend的用法 append 是插入到元素中,并放到元素内的最后面prepend 是插入到元素中,并放到元素内的最前面例$("body"). ...
- jQuery 追加元素的方法如append、prepend、before
1.jQuery append() 方法 jQuery append() 方法在被选元素的结尾插入内容. 实例 复制代码代码如下: $("p").append("Some ...
随机推荐
- About_AJAX
Asynchronous JavaScript And XML (1)AJAX大多用于验证和分页: (2)首先要激活(对象): window.ActiveXObject(针对IE): window.X ...
- 自己做的一个小demo
上图: 主段代码: <script type="text/javascript"> var getRandomColor = function(){ return (f ...
- django1.9 创建项目和app并初始化项目
创建项目: django-admin startproject mytest04 创建app: python manage.py startapp app04 配置:settings.py 1. 2 ...
- 对Oracle10g rac ons服务的一些理解
1.什么是ONS ONS(Oracle Notification Service)是Oracle Clusterware 实现FAN Event Push模型的基础. 在传统模型中,客户端需要 ...
- 【HDU4419 Colourful Rectangle】 线段树面积并
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4419 题目大意:给你n个矩形,每个矩形都有一种颜色,矩形覆盖会出现另外一种颜色,问你所有矩形中不同的颜 ...
- mysql添加外键错误
异常信息如下: ERROR <HY000>:Can't create table '.\itac\#sql-6fc_546f.frm' <errno:121> 我的问题是新建的 ...
- mysql实验
实验步骤同一台电脑装了两个mysql,端口号不同,mysql5.6安装好之后只有一个my-default的文件,将其中添加一些错误内容,改mysql依然可以启动成功,说明使用的不是该文件,将my-de ...
- c++之vector
vector是STL中最常见的容器,它是一种顺序容器,支持随机访问.vector是一块连续分配的内存,从数据安排的角度来讲,和数组极其相似, 不同的地方就是:数组是静态分配空间,一旦分配了空间的大小, ...
- IOS第二天多线程-04简化单例模式
******HMSingleton-ARC.h // .h文件 #define HMSingletonH(name) + (instancetype)shared##name; // .m文件 #de ...
- AFNetworking 提示"The resource could not be loaded because the App Transport Security policy requires the use of a secure connection" 解决办法
原因:iOS9以后,苹果把原http协议改成了https协议,所以不能直接在http协议下GET/POST 解决方案之一: 直接编辑工程文件下的Info.plist文件,加入以下代码 <key& ...