在上面的例子中,我们只在被选元素的开头/结尾插入文本/HTML。

不过,append() 和 prepend() 方法能够通过参数接收无限数量的新元素。可以通过 jQuery 来生成文本/HTML(就像上面的例子那样),或者通过 JavaScript 代码和 DOM 元素。

在下面的例子中,我们创建若干个新元素。这些元素可以通过 text/HTML、jQuery 或者 JavaScript/DOM 来创建。然后我们通过 append() 方法把这些新元素追加到文本中(对 prepend() 同样有效):

实例

function appendText()
{
var txt1="<p>Text.</p>"; // 以 HTML 创建新元素
var txt2=$("<p></p>").text("Text."); // 以 jQuery 创建新元素
var txt3=document.createElement("p"); // 以 DOM 创建新元素
txt3.innerHTML="Text.";
$("p").append(txt1,txt2,txt3); // 追加新元素
}

通过 append() 和 prepend() 方法添加若干新元素的更多相关文章

  1. 通过 after() 和 before() 方法添加若干新元素

    after() 和 before() 方法能够通过参数接收无限数量的新元素.可以通过 text/HTML.jQuery 或者 JavaScript/DOM 来创建新元素. 在下面的例子中,我们创建若干 ...

  2. 关于jQuery的append()和prepend()方法的小技巧

    最近工作上有个需求是要求一个自动向上滚动的列表,表有很多行,但只显示一行,每次滚动一行.很简单的一个功能,代码如下 <div class="scroll-area"> ...

  3. 添加新内容的四个 jQuery 方法:append,prepend,after,before

    添加新内容的四个 jQuery 方法区别如下: append() - 在被选元素(里面)的结尾插入内容prepend() - 在被选元素(里面)的开头插入内容 //jQuery append() 方法 ...

  4. appendChild append insertBefore prepend

      CreateTime--2017年11月2日16:57:59 Author:Marydon appendChild()与append() insertBefore()与prepend()区别与联系 ...

  5. jQuery-添加新元素的方法(append()、prepend()、before()、after())

    1.以 HTML 创建新元素 var txt1="<p>Text.</p>"; 2.以 jQuery 创建新元素 var txt2=$("< ...

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

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

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

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

  8. 获取器操作都是针对数据而不是数据集的,要通过append()方法添加数据表不存在的字段

    获取器操作都是针对数据而不是数据集的,要通过append()方法添加数据表不存在的字段 public function getMembership(){ //加入会员s_id = 1 $busines ...

  9. jquery中append、prepend, before和after方法的区别(一)

    原文:http://blog.csdn.net/woosido123/article/details/64439490 在 jquery中append() 与 prepend()是在元素内插入内容(该 ...

随机推荐

  1. Javascript高级程序设计-问答模式

    1.谈谈javascript数组排序方法sort()的使用,重点介绍sort()参数的使用及其内部机制 sort的实现的功能类似JAVA的比较器,数据排序从多维数组的第一维开始排序可以自己定义排序方法 ...

  2. cs-JsonHelper

    ylbtech-Unitity: cs-JsonHelper AjaxResult.cs  FormatJsonExtension.cs 1.A,效果图返回顶部   1.B,源代码返回顶部 1.B.1 ...

  3. 如何用路由器改成WiFi Pineapple系统镜像网络流量

    本文主要介绍利用自己现有的设备,如何制作和使用WiFi Pineapple镜像网络流量,利用DWall模块分析用户数据,然后根据自己的需求,给DWall加入了日志记录功能.最后介绍了如何防范wifi ...

  4. javascript快速入门11--正则表达式

    正则表达式可以: 测试字符串的某个模式.例如,可以对一个输入字符串进行测试,看在该字符串是否存在一个电话号码模式或一个信用卡号码模式.这称为数据有效性验证 替换文本.可以在文档中使用一个正则表达式来标 ...

  5. 面试题:判断两个字符串是否互为回环变位(Circular Rotaion)

    题干:   如果字符串 s 中的字符循环移动任意位置之后能够得到另一个字符串 t,那么 s 就被称为 t 的回环变位(circular rotation).   例如,ACTGACG 就是 TGACG ...

  6. Android百度地图(二)结合方向传感器我们自己定位哪里走

    Android百度地图(二)结合方向传感器我们自己定位哪里走 本文代码在http://blog.csdn.net/xyzz609/article/details/51943556的基础上进一步改动.有 ...

  7. go 中的pacage 名称 和import {}中的名称

    参考: https://groups.google.com/forum/#!topic/golang-nuts/oawcWAhO4Ow Hi, Nan Xiao <xiaona...@gmail ...

  8. Excel的列数以数字格式查看

    1.Excel中的列数默认是以字母形式显示的,当我们有大量数据并想知道任一数据是第多少行多少列时这样就不方便了,我们可以通过如下设置来达到让EXCEL以数字形式显示行数和列数的效果. 2.点击文件-- ...

  9. Jenkins+Maven+Gitlab+Nexus持续集成环境搭建

      1.软件及服务介绍 Jenkins:jenkins是实现代码自动化流程上线的工具,Jenkins是一个独立的开源软件项目,是基于Java开发的一种持续集成工具,用于监控持续重复的工作,旨在提供一个 ...

  10. wifi破解到局域网渗透

    本文转自 _博客 一,密码破解 wifi破解最主要的还是抓握手包破解(不要给我说某某钥匙的“分享”). wifi认证主要分为四步: 1,无线客户端与ap连接时,首先发送一个认证请求包 2,ap收到请求 ...