1.jQuery append() 方法 

jQuery append() 方法在被选元素的结尾插入内容。 
实例

复制代码代码如下:

$("p").append("Some appended text."); 

2.jQuery prepend() 方法 

jQuery prepend() 方法在被选元素的开头插入内容。 
实例

复制代码代码如下:

$("p").prepend("Some prepended text."); 

3、after() 和 before() 方法 

jQuery after() 方法在被选元素之后插入内容。 
jQuery before() 方法在被选元素之前插入内容。 
实例

复制代码代码如下:

$("img").after("Some text after"); 
$("img").before("Some text before"); 

下面脚本之家小编给补充一下

append() 方法在被选元素的结尾插入内容。

prepend() 方法在被选元素的开头插入内容。

after() 方法在被选元素之后插入内容。

before() 方法在被选元素之前插入内容。

演示代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<script type="text/javascript" src="http://common.jb51.net/jslib/jquery/jquery.min.js"></script>
<div class="testdiv">
  <ul>
    <li>第一个li标签</li>
  </ul>
</div>
 
<script>
 
  //append
  $('.testdiv ul').append('<li>append 插入的li</li>');
  //prepend
  $('.testdiv ul').prepend('<li>prepend 插入的li</li>');
  //after
  $('.testdiv ul').after('<li>after 插入的li</li>');
  //before
  $('.testdiv ul').before('<li>before 插入的li</li>');
 
</script>

jQuery 追加元素的方法如append、prepend、before,after(转)的更多相关文章

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

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

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

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

  3. jquery 追加元素的方法

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

  4. jquery 追加元素/jquery文档处理,插入、修改、移动、删除指定的DOM元素.

    jquery 追加元素 $("#content").append("..."); // 添加到元素内部最后面 $("#content").p ...

  5. JQuery获取元素的方法总结

    JQuery获取元素的方法总结 一.说明   获取元素的方法分为两种:jQuery选择器.jQuery遍历函数. 做个总结,巩固下知识. 二.获取本身 1.只需要一种jQuery选择器   选择器 实 ...

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

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

  7. jquery追加元素的不同语法

    问题 项目中越来越多的地方需要实现无刷新来更新页面局部内容,使用ajax从后台获取数据然后追加到页面中.那么怎么获取数据之后如何实现元素的追加呢? 解决 jQuery提供追加元素函数,掌握常用的四种追 ...

  8. 原生JS和jQuery创建元素的方法

    jQ创建元素的方法 1.原生代码 .creatElement('tr')` .innerHTML = '<h1>加油</h1>' document.write('<h1& ...

  9. Jquery DOM元素的方法

    jQuery DOM 元素方法 函数 描述 .get() 获得由选择器指定的 DOM 元素. .index() 返回指定元素相对于其他指定元素的 index 位置. .size() 返回被 jQuer ...

随机推荐

  1. ubuntu 12.04 sever下安装jre

    具体步骤如下: 首先打开http://www.java.com/en/download/linux_manual.jsp?locale=en 选择你想下载的版本,此处我选择的是jre-7u25-lin ...

  2. HTML和XHTML的区别

    引言:XHTML是用XML语言重写了HTML,也可以理解为XHTML是HTML的过渡语言,它比HTML语言更严谨,基本语言都还是沿用HTML的标签. XHTML和HTML的差别主要分为两大类: 功能上 ...

  3. 如何在openresty里解析域名

    转:原文:http://hambut.com/2016/09/09/how-to-resolve-the-domain-name-in-openresty/?utm_source=tuicool&am ...

  4. MFC去掉标题栏

    在初始化的时候加入以下函数 //去掉标题栏 ModifyStyle(WS_CAPTION, NULL, SWP_DRAWFRAME );

  5. 在程序中执行shell命令

    在linux系统下的操作中我们会经常用到shell命令来进行,一开始学习进程的时候对于shell命令也进行了思考,认为shell命令就是一个进程的外壳,经过了后来的学习对于这一点也有了更多的认识. 用 ...

  6. 耿丹CS16-2班第四次作业汇总

    Deadline: 2016-10-13 12:00 作业内容 实验3-1 分别使用while循环.do while循环.for循环求1+2+3+ --+100. 实验3-2 分别使用while循环. ...

  7. 读书笔记-JavaScript面向对象编程(一)

    PDF下载链接: http://pan.baidu.com/s/1eSDSTVW 密码: 75jr 第1章 引言 1.1 回顾历史 1.2 变革之风 1.3 分析现状 1.4 展望未来 1.5 面向对 ...

  8. Android插件化框架研究-DroidPlugin

    直接贴上我做的ppt.

  9. 3 Git服务器搭建

    1. 环境部署 系统环境:服务器端:CentOS 6.5 ,ip:192.168.56.1 客户端:CentOS 6.5 ,ip:192.168.56.101 软件版本:服务器端:源码编译安装,git ...

  10. 使用ngrok将内网映射为外网

    如何将自己的本地服务器映射到外网上去?我们可以使用ngrok这个工具,下载地址:http://pan.baidu.com/s/1slnMwPn 具体的操作步骤如下: 第一步.下载客户端我们建议下载的时 ...