jQuery使用append在html元素后同时添加多项内容的方法


Posted in Javascript onMarch 26, 2015

本文实例讲述了jQuery使用append在html元素后同时添加多项内容的方法。分享给大家供大家参考。具体分析如下:

下面的代码可以同时在文本段落后添加多项内容

<!DOCTYPE html>
<html>
<head>
<script src="js/jquery.min.js">
</script>
<script>
function appendText()
{
var txt1="<p>Text.</p>"; // Create text with HTML
var txt2=$("<p></p>").text("Text."); // Create text with jQuery
var txt3=document.createElement("p");
txt3.innerHTML="Text."; // Create text with DOM
$("body").append(txt1,txt2,txt3); // Append new elements
}
</script>
</head>
<body>
<p>This is a paragraph.</p>
<button onclick="appendText()">Append text</button>
</body>
</html>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
jQuery库与其他JS库冲突的解决办法
Feb 07 Javascript
Json字符串转换为JS对象的高效方法实例
May 01 Javascript
关于JavaScript的变量的数据类型的判断方法
Aug 14 Javascript
jquery自定义表格样式
Nov 23 Javascript
基于jquery实现轮播特效
Apr 22 Javascript
设置点击文本框或图片弹出日历控件的实现代码
May 12 Javascript
微信小程序 图片宽高自适应详解
May 11 Javascript
vue实现文章内容过长点击阅读全文功能的实例
Dec 28 Javascript
vuex中的 mapState,mapGetters,mapActions,mapMutations 的使用
Apr 13 Javascript
layui prompt 设置允许空白提交的方法
Sep 24 Javascript
javascript实现贪吃蛇小游戏
Jul 28 Javascript
Vue 样式切换及三元判断样式关联操作
Aug 09 Javascript
jQuery使用before()和after()在元素前后添加内容的方法
Mar 26 #Javascript
jQuery使用after()方法在元素后面添加多项内容的方法
Mar 26 #Javascript
jQuery使用empty()方法删除元素及其所有子元素的方法
Mar 26 #Javascript
jquery使用remove()方法删除指定class子元素
Mar 26 #Javascript
jQuery使用removeClass方法删除元素指定Class的方法
Mar 26 #Javascript
jQuery给多个不同元素添加class样式的方法
Mar 26 #Javascript
Js实现自定义右键行为
Mar 26 #Javascript
You might like
php 表单验证实现代码
2009/03/10 PHP
php中serialize序列化与json性能测试的示例分析
2013/04/27 PHP
Yii实现文章列表置顶功能示例
2016/10/18 PHP
深入讲解PHP的对象注入(Object Injection)
2017/03/01 PHP
PHP实现的简单异常处理类示例
2017/05/04 PHP
php实现网页端验证码功能
2017/07/11 PHP
jQuery EasyUI中对表格进行编辑的实现代码
2010/06/10 Javascript
jquery keypress,keyup,onpropertychange键盘事件
2010/06/25 Javascript
基于jQuery的烟花效果(运动相关)点击屏幕出烟花
2012/06/14 Javascript
jsPDF导出pdf示例
2014/05/02 Javascript
node.js中的buffer.fill方法使用说明
2014/12/14 Javascript
Node.js中防止错误导致的进程阻塞的方法
2016/08/11 Javascript
JS代码实现百度地图 画圆 删除标注
2016/10/12 Javascript
原生javascript实现的ajax异步封装功能示例
2016/11/03 Javascript
javascript自执行函数
2017/02/10 Javascript
JS 实现随机验证码功能
2017/02/15 Javascript
node puppeteer(headless chrome)实现网站登录
2018/05/09 Javascript
AngularJS ui-router刷新子页面路由的方法
2018/07/23 Javascript
js实现全选反选不选功能代码详解
2019/04/24 Javascript
javascript中的数据类型检测方法详解
2019/08/07 Javascript
Python实现比较两个文件夹中代码变化的方法
2015/07/10 Python
Python实现的求解最小公倍数算法示例
2018/05/03 Python
python3.6.3安装图文教程 TensorFlow安装配置方法
2020/06/24 Python
使用python获取邮箱邮件的设置方法
2019/09/20 Python
Python实现图像的垂直投影示例
2020/01/17 Python
基于Python3.6中的OpenCV实现图片色彩空间的转换
2020/02/03 Python
基于python 取余问题(%)详解
2020/06/03 Python
PyCharm2020.1.1与Python3.7.7的安装教程图文详解
2020/08/07 Python
html5-websocket基于远程方法调用的数据交互实现
2012/12/04 HTML / CSS
Europcar意大利:汽车租赁
2019/07/07 全球购物
学校运动会开幕演讲稿
2014/01/04 职场文书
如何写辞职书
2015/02/26 职场文书
费城故事观后感
2015/06/10 职场文书
2015年暑假生活总结
2015/07/13 职场文书
幼儿园教师暑期培训心得体会
2016/01/09 职场文书
使用CSS实现音波加载效果
2023/05/07 HTML / CSS