通过 append() 和 prepend() 方法添加若干新元素
在上面的例子中,我们只在被选元素的开头/结尾插入文本/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() 方法添加若干新元素的更多相关文章
- 通过 after() 和 before() 方法添加若干新元素
after() 和 before() 方法能够通过参数接收无限数量的新元素.可以通过 text/HTML.jQuery 或者 JavaScript/DOM 来创建新元素. 在下面的例子中,我们创建若干 ...
- 关于jQuery的append()和prepend()方法的小技巧
最近工作上有个需求是要求一个自动向上滚动的列表,表有很多行,但只显示一行,每次滚动一行.很简单的一个功能,代码如下 <div class="scroll-area"> ...
- 添加新内容的四个 jQuery 方法:append,prepend,after,before
添加新内容的四个 jQuery 方法区别如下: append() - 在被选元素(里面)的结尾插入内容prepend() - 在被选元素(里面)的开头插入内容 //jQuery append() 方法 ...
- appendChild append insertBefore prepend
CreateTime--2017年11月2日16:57:59 Author:Marydon appendChild()与append() insertBefore()与prepend()区别与联系 ...
- jQuery-添加新元素的方法(append()、prepend()、before()、after())
1.以 HTML 创建新元素 var txt1="<p>Text.</p>"; 2.以 jQuery 创建新元素 var txt2=$("< ...
- jQuery 追加元素的方法如append、prepend、before,after(转)
1.jQuery append() 方法 jQuery append() 方法在被选元素的结尾插入内容. 实例 复制代码代码如下: $("p").append("Some ...
- jQuery 追加元素的方法如append、prepend、before
1.jQuery append() 方法 jQuery append() 方法在被选元素的结尾插入内容. 实例 复制代码代码如下: $("p").append("Some ...
- 获取器操作都是针对数据而不是数据集的,要通过append()方法添加数据表不存在的字段
获取器操作都是针对数据而不是数据集的,要通过append()方法添加数据表不存在的字段 public function getMembership(){ //加入会员s_id = 1 $busines ...
- jquery中append、prepend, before和after方法的区别(一)
原文:http://blog.csdn.net/woosido123/article/details/64439490 在 jquery中append() 与 prepend()是在元素内插入内容(该 ...
随机推荐
- CSS3:box-sizing 怪异盒模型
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- mongodb_profier
http://docs.mongodb.org/manual/reference/database-profiler/ 一.获取.设置profile(profile用collection存储数据) d ...
- 在Windows平台下安装与配置Memcached及C#使用方法
1.在Windows下安装Memcached 资料来源:http://www.jb51.net/article/30334.htm 在Windows平台下安装与配置Memcached的方法,Memca ...
- 在Oracle Enterprise Linux R5U7上安装Oracle 11gr2数据库
折腾了好几次,经验是: 包的安装 在安装包里,需要把开发方面的安装包都装上. 另外安装完成后,需要安装的包包括: cd /media/cdrom/Server rpm -Uvh binutils-2. ...
- 我使用过的Linux命令之swig - 把C/C++的代码嵌入Java等语言的开发工具
用途说明 SWIG是Simplified Wrapper and Interface Generator的缩写,其官方站点是http://www.swig.org/.SWIG是个帮助使用C或者C++编 ...
- More is better——并查集求最大集合(王道)
Description Mr Wang wants some boys to help him with a project. Because the project is rather comple ...
- Windows下编译vpx获得各个项目VS2010解决方案的步骤
最近研究了一下几种常见的视频编码器:x264,x265,vpx.本文简单记录一下它们的编译方法. x264,x265,vpx这三个开源的视频编码器可以说是当今“最火”的视频编码器.x264现在占据着H ...
- [Parcel] Running TypeScript with parcel-bundler
TO get started with TypeScirpt quickly in your local computer is using parcel-bunlder: npm i -g parc ...
- 【翻译自mos文章】在Oracle单机数据库中定义database service
来源于: Defining a Database Service with a Stand Alone Database (文档 ID 1260134.1) APPLIES TO: Oracle Da ...
- html5表单验证(Bootstrap)
html5表单验证(Bootstrap) 邮箱验证: <input name="email" type="text" placeholder=&quo ...