在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 介绍的更多相关文章

  1. jQuery中append appendTo prepend prependTo insertBefore insertAfter after before之间的区别

    jQuery中有一个很关键的元素操作,他们的使用方法都一样,但是呈现的结果有所不同. <!DOCTYPE html> <html lang="en"> &l ...

  2. jquery append、prepend、before等等

    1.jQuery append() 方法 jQuery append() 方法在被选元素的结尾插入内容. 实例 复制代码代码如下: $("p").append("Some ...

  3. 关于append,appendTo,prepend,prependTo的区别

    之前做项目对于这几个的方法总是有点模糊,尤其是prepend和prependTo; 1.append <style> span{ background:yellow; } .test{ b ...

  4. after()和append()的区别、before()和prepend()区别、appendTo()和prependTo()、insertAfter()和insertBefore()

    一.after()和before()方法的区别 after()——其方法是将方法里面的参数添加到jquery对象后面去:    如:A.after(B)的意思是将B放到A后面去:    before( ...

  5. jQuery之设置元素内容(移动和复制元素,使用append(),appendTo()方法)

    jQuery之设置元素内容(移动和复制元素,使用append(),appendTo()方法) ---------- 如果想把内容添加到现有内容末尾,可以利用append()命令.append()命令语 ...

  6. jquery:after append appendTo三个函数的区别

    1.查找元素节点      var $li = $(“ul li:eq(0)”);//获取ul标记下的第一个li,也可以写成 $(“#ulID li:eq(0)”);    2.查找元素属性 利用jq ...

  7. jQuery 文档操作 - prependTo() ,appendTo()方法

    其他jquery文档操作方法:http://www.w3school.com.cn/jquery/jquery_ref_manipulation.asp jQuery 参考手册 - 文档操作 appe ...

  8. jQuery 追加元素的方法如append、prepend、before,after(转)

    1.jQuery append() 方法 jQuery append() 方法在被选元素的结尾插入内容. 实例 复制代码代码如下: $("p").append("Some ...

  9. jquery中append跟prepend的用法

    jquery中append和prepend的用法 append   是插入到元素中,并放到元素内的最后面prepend  是插入到元素中,并放到元素内的最前面例$("body"). ...

  10. jQuery 追加元素的方法如append、prepend、before

    1.jQuery append() 方法 jQuery append() 方法在被选元素的结尾插入内容. 实例 复制代码代码如下: $("p").append("Some ...

随机推荐

  1. Android 图片三级缓存

    图片缓存的原理 实现图片缓存也不难,需要有相应的cache策略.这里采用 内存-文件-网络 三层cache机制,其中内存缓存包括强引用缓存和软引用缓存(SoftReference),其实网络不算cac ...

  2. Defining custom settings in Odoo

    Unfortunately Odoo documentation doesn’t seem to include any information about adding new configurat ...

  3. Centos 安装了 Wkhtmltopdf 却依旧显示 无法打印pdf

    Odoo里判断wkhtmlpdf是否安装的代码在 openerp/tools/misc.py 文件中: def find_in_path(name): path = os.environ.get('P ...

  4. html第一天

    html为超文本标记语言, html下的内容不去分大小写: 标签必须要有开始和结束,<br>和<hr>特殊,在标签内结束<br/>,<hr/>:下划线 ...

  5. HTTP 战役 与 历史

    导火线1992年,有一家公司Nombas 开发了一种叫C--的嵌入式脚本语言,后来觉得名字比较晦气,最终改名为scriptEase.而这种可以嵌入网页中的脚本的理念,成为日后移动互联网蓬勃发展的一块重 ...

  6. WS调用的时候报错

    报错内容javax.xml.ws.WebServiceException: Method recognizeIdentityCardByFilePath is exposed as WebMethod ...

  7. IOS第18天(4,核心动画,时钟效果,定时器,图片旋转角度,CALayer 锚点,获取当前,小时,秒,分)

    **** #import "HMViewController.h" // 每秒秒针转6度 #define perSecendA 6 // 每分钟分针转6度 #define perM ...

  8. Color Space: Ycc

    在进行图像扫描时,有一种重要的扫描输入设备PhotoCd,由于PhotoCd在存储图像的时候要经过一种模式压缩,所以PhotoCd采用了Ycc颜色空间,此空间将亮度作由它的主要组件,具有两个单独的颜色 ...

  9. ThinkPHP 3.2.3 URL 路由的使用

    ThinkPHP3.2.3 手册中路由的地址是: http://www.kancloud.cn/manual/thinkphp/1706 简单配置实例:在配置文件 config.php 中添加 //路 ...

  10. JQuery-文档处理&选择器

    <body> <div id="textDiv">...</div> <p>第一段..</p> <b>第二段 ...