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. [整理]AngularJS移动端开发遇到的问题

    最近在开发一个移动WebAPP的小项目,因为之前一直使用AngularJS, 对于这个项目,废话不多说,拿过来就用上了. 开发过程是一路通畅和舒服的,但是,却忽略了一个非常重要的问题,移动2G环境下的 ...

  2. 现代软件工程作业 第二章 Github的使用

    Github的使用 创建团队 Github首页点击Create Orginazation,出现如下界面: 填写相关信息,邀请团队成员: 点击确认,创建团队完成,界面如下: 创建新的版本库 点击Crea ...

  3. 在利用xampp开发时候为apache设置多个项目目录

    在做毕业设计的时候由于想将工作目录与毕业设计的目录分离,所以有此需求: 下面两种方法是google出来的,分别通过配置多ip和多端口实现,不是能否用单ip发布多个项目,如有方法请留言,学习一下 1.配 ...

  4. Android之Linearlayouy线性布局

    写了个小例子xml代码如下: <?xml version="1.0" encoding="utf-8"?> <RelativeLayout x ...

  5. 简单的C语言文法

    <程序>→<外部声明>|<程序><外部声明> <外部声明>→<函数定义>|<声明> <函数定义>→< ...

  6. BZOJ 3784: 树上的路径

    Description 问一棵树上前 \(k\) 大路径的边权. Sol 边分治. 非常感谢数据没有菊花图. 为了写写边分治试试然后就开了这道题. 边分治非常好想,选一条重边,分成两部分,然后分别求最 ...

  7. python之路十九

    1.Django请求生命周期        -> URL对应关系(匹配) -> 视图函数 -> 返回用户字符串        -> URL对应关系(匹配) -> 视图函数 ...

  8. linux下编译时,链接math库

    在gcc下用到数学函数,如sqrt.在gcc时要加上 -lm 参数,这样告诉编译器我要用到数学函数了 . 如:gcc a.c -o a -lm 当在用Eclipse编译使用数学函数的C语言程序时,如s ...

  9. DevExpress 在使用Ribbon皮肤时标题栏不变化的原因

    将 form的 AllowFormGlass 属性 该为False 就可以标题栏皮肤化了.

  10. Linux下GNOME桌面的安装

    yum grouplist //列出yum仓库里的软件组列表 GNOME桌面的安装 yum install soft1 soft2 //使用yum源安装软件 yum groupinstall grou ...