我们先拟定一个代码场景

  1. <div>start</div>
  2. <p>123</p>
  3. <div>end</div>

html() 操作节点中的内容,一般我们可以用来快速给一个容器中赋值。

$("p").html("abc");

最终看到的结果

  1. <div>start</div>
  2. <p>abc</p>
  3. <div>end</div>

append() 追加到节点中的末尾处

$("p").append("abc");

最终看到的结果

  1. <div>start</div>
  2. <p>123abc</p>
  3. <div>end</div>

prepend() 追加到节点中的起始处

$("p").prepend("abc");

最终看到的结果

  1. <div></div>
  2. <p>abc123</p>
  3. <div>end</div>

alert() 追加到节点的后面

$("p").prepend("<p>abc</p>");

最终看到的结果

  1. <div>start</div>
  2. <p>123</p>
  3. <p>abc</p>
  4. <div>end</div>

before() 追加节点的前面

$("p").prepend("<p>abc</p>");

最终看到的结果

  1. <div>start</div>
  2. <p>abc</p>
  3. <p>123</p>
  4. <div>end</div>

jQuery HTML节点元素修改、追加的方法 html()、append()、prepend()、的更多相关文章

  1. jquery追加元素的几种方法(append()、prepend()、after()、before()、insertAfter()、insertBefore())

    最近项目不是很忙,抽空整理了下,js中常用追加元素的几种方法. <!DOCTYPE html> <html> <head> <meta charset=&qu ...

  2. jquery 追加元素的方法(append prepend after before 的区别)

    append() 方法在被选元素的结尾插入内容. prepend() 方法在被选元素的开头插入内容. after() 方法在被选元素之后插入内容. before() 方法在被选元素之前插入内容. &l ...

  3. jquery中使元素显示和隐藏方法之间的区别

    在实际的项目开发中,要使一个元素隐藏的方法有很多,比如css的多种属性和jquery的多种方法,虽然他们的作用都是使元素不可见,但是各个方法实现的原理是不一样的.下面主要介绍jquery各个元素隐藏方 ...

  4. jQuery 监听元素内容变化的方法

    我们可以用onchange事件来完成元素值发生改变触发的监听.但是 onchange 比较适用于<input>.<textarea> 以及 <select> 元素. ...

  5. jquery 查找子元素的几种方法

    <div class="tm-clear tb-hidden tm_brandAttr" id="J_BrandAttr" style="dis ...

  6. jquery判断页面元素是否存在的方法

  7. jquery 元素控制(追加元素/追加内容)

    参考网址:http://www.jquerycn.cn/a_5521 一.在元素内部/外部追加元素 append,prepend:添加到子元素 before,after:作为兄弟元素添加 html: ...

  8. jquery 元素控制(追加元素/追加内容)介绍及应用

    http://blog.csdn.net/gisredevelopment/article/details/41126533 一.在元素内部/外部追加元素 append,prepend:添加到子元素  ...

  9. 三、jQuery--jQuery基础--jQuery基础课程--第5章 jQuery 操作DOM元素

    1.使用attr()方法控制元素的属性 attr()方法的作用是设置或者返回元素的属性,其中attr(属性名)格式是获取元素属性名的值,attr(属性名,属性值)格式则是设置元素属性名的值. 例如,使 ...

随机推荐

  1. CSS 3中边框怎么用

    (1)设置边框图片的来源 图片边框默认只在四个顶点显示 none: 无背景图片; border-image-source: url('borderImage.png'); (2)边框图片的分割 将图片 ...

  2. 《高级Web应用程序设计》课程学习资料

    任务1:什么是ASP.NET MVC 1.1  ASP.NET MVC简介 1.2 认识ASP.NET MVC项目结构 1.3 ASP.NET MVC生命周期 任务2:初识ASP.NET MVC项目开 ...

  3. centos apache源码安装过程记录

    1.下载相关源文件 wget http://mirror.bjtu.edu.cn/apache/httpd/httpd-2.4.18.tar.gzwget http://mirrors.hust.ed ...

  4. 【转】从 ArcGIS for Desktop 发布地图服务

    原文链接:http://resources.arcgis.com/zh-CN/help/tutorials/01z300000007000000.htm 本教程的目的是将地图服务直接从 ArcGIS ...

  5. PHP二次开发discuz3.2最新体验

    康盛官方于6月4号发布了discuz3.2的正式版,因为这两天一直忙于一个项目,一直没来的及体验,现在抽时间总算是装上了,也体验一把. 根据官方说明:Discuz! X3.2 在继承和完善 Discu ...

  6. 鼠标滚轮控制侧边div上下翻动效果

    css部分: <style> * { margin: 0; padding: 0;} .wrap { width: 1000px; margin: 0 auto; overflow: hi ...

  7. Keeplived配置Nginx双机高可用

    一.简介不管是Keepalived还是Heartbeat做高可用,其高可用,都是站在服务器脚本去说的高可用,而不是服务的角度.也就是说,如果服务器DOWN机或者网络出现故障,高可用是可以实现自动切换的 ...

  8. XML学习摘要

    XML元素可以在开始标签中包含属性. 属性(Attribute)提供关于元素的额外信息,属性必须加引号. 属性值必须被引号包围,不过单引号和双引号均可,若属性值本身包含双引号,那么有必要使用单引号包围 ...

  9. rails之 Migrations (转)

    1.简介 在rails中用migration可以很方便的管理数据库的结构.可以创建数据库,创建表,删除表,添加字段,删除字段,整理数据. migration就是一系列的class,这些类都继承了Act ...

  10. ios网络学习------6 json格式数据的请求处理

    ios网络学习------6 json格式数据的请求处理 分类: IOS2014-06-30 20:33 471人阅读 评论(3) 收藏 举报 #import "MainViewContro ...