jQuery DOM插入节点操作指南


Posted in Javascript onMarch 03, 2015

方法 描述 示例
append() 向每个匹配的元素内部追加内容 HTML代码:

我想说:

jQuery代码: $("p").append("你好"); 结果:

我想说:你好

appendTo() 将所有匹配的元素追加到指定的元素中 。实际上,使用该方法是颠倒了常规 的$(A).append(B)的操作,是将A追加到B中。 HTML代码:

我想说:

jQuery代码: $("你好").appendTo("p") 结果:

我想说:你好

prepend() 向每个匹配的元素内部前置内容 HTML代码:

我想说:

jQuery代码: $("p").prepend("你好") 结果:

你好我想说:

prependTo() 将所有匹配的元素前置到指定的元素中 。实际上,使用该方法是颠倒了 常规$(A).prepend(B)操作。 HTML代码:

我想说:

jQuery代码: $("你好").prependTo("p") 结果:

你好我想说:

after() 在每个匹配的元素后插入内容 HTML代码:

我想说:

jQuery代码: $("p").after("你好") 结果:

我想说:

你好
insertAfter() 将所有匹配的元素插入到指定元 素的后面,实际上,使用该方法 是颠倒了常规的$(A).after(B)操作 HTML代码:

我想说:

jQuery代码: $("你好").insertAfter("p") 结果:

我想说:

你好
before() 在每个匹配的元素之前插入内容 HTML代码:

我想说:

jQuery代码: $("p").before("你好") 结果: 你好

我想说:

insertBefore() 将所以匹配的元素插入到指 定的元素的前面。实际上, 使用该方法是颠倒了常规 的$(A).before(B)的操作。 HTML代码:

我想说:

jQuery代码: $("你好").insertBefore("p") 结果: 你好

我想说:

以上就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
json 实例详细说明教程
Oct 31 Javascript
js获取当前地址 JS获取当前URL的示例代码
Feb 26 Javascript
jquery图片轮播插件仿支付宝2013版全屏图片幻灯片
Apr 03 Javascript
JavaScript字符串对象fromCharCode方法入门实例(用于把Unicode值转换为字符串)
Oct 17 Javascript
基于JavaScript实现动态添加删除表格的行
Feb 01 Javascript
关于JS中的apply,call,bind的深入解析
Apr 05 Javascript
JavaScript使用键盘输入控制实现数字验证功能
Aug 19 Javascript
jquery-mobile基础属性与用法详解
Nov 23 Javascript
JS实现将链接生成二维码并转为图片的方法
Mar 17 Javascript
详解jenkins自动化部署vue
May 14 Javascript
JavaScript函数式编程(Functional Programming)高阶函数(Higher order functions)用法分析
May 22 Javascript
如何HttpServletRequest文件对象并储存
Aug 14 Javascript
JS运动框架之分享侧边栏动画实例
Mar 03 #Javascript
jQuery DOM删除节点操作指南
Mar 03 #Javascript
JS实现表格数据各种搜索功能的方法
Mar 03 #Javascript
深入理解JavaScript系列(27):设计模式之建造者模式详解
Mar 03 #Javascript
javascript验证身份证号
Mar 03 #Javascript
JS烟花背景效果实现方法
Mar 03 #Javascript
深入理解JavaScript系列(26):设计模式之构造函数模式详解
Mar 03 #Javascript
You might like
第十二节 类的自动加载 [12]
2006/10/09 PHP
过滤掉PHP数组中的重复值的实现代码
2011/07/17 PHP
PHP编程之设置apache虚拟目录
2016/07/08 PHP
Laravel中的Blade模板引擎示例详解
2017/10/10 PHP
详细解读php的命名空间(二)
2018/02/21 PHP
javascript入门·动态的时钟,显示完整的一些方法,新年倒计时
2007/10/01 Javascript
JS学习之一个简易的日历控件
2010/03/24 Javascript
jQuery lazyload 的重复加载错误以及修复方法
2010/11/19 Javascript
jQuery数组处理方法汇总
2011/06/20 Javascript
裁剪字符串trim()自定义改进版
2013/04/10 Javascript
jQuery操作CheckBox的方法介绍(选中,取消,取值)
2014/02/04 Javascript
js replace替换所有匹配的字符串
2014/02/13 Javascript
Bootstrap每天必学之按钮(一)
2015/11/24 Javascript
JS简单实现DIV相对于浏览器固定位置不变的方法
2016/06/17 Javascript
利用Javascript实现BMI计算器
2016/08/16 Javascript
JS+HTML5 FileReader实现文件上传前本地预览功能
2020/03/27 Javascript
解决在vue+webpack开发中出现两个或多个菜单公用一个组件问题
2017/11/28 Javascript
基于node.js实现微信支付退款功能
2017/12/19 Javascript
vue axios请求超时的正确处理方法
2018/04/02 Javascript
React之PureComponent的使用作用
2018/07/10 Javascript
AngularJS中ng-options实现下拉列表的数据绑定方法
2018/08/13 Javascript
vue-cli3项目展示本地Markdown文件的方法
2019/06/07 Javascript
python 从远程服务器下载日志文件的程序
2013/02/10 Python
图文讲解选择排序算法的原理及在Python中的实现
2016/05/04 Python
Python绘制并保存指定大小图像的方法
2019/01/10 Python
wxPython色环电阻计算器
2019/11/18 Python
pytorch之Resize()函数具体使用详解
2020/02/27 Python
解决keras backend 越跑越慢问题
2020/06/18 Python
pytorch 移动端部署之helloworld的使用
2020/10/30 Python
python里反向传播算法详解
2020/11/22 Python
大学同学聚会邀请函
2014/01/19 职场文书
《夸父追日》教学反思
2014/02/26 职场文书
数控技校生自我鉴定
2014/03/02 职场文书
工艺工程师岗位职责
2014/03/04 职场文书
银行内勤岗位职责
2014/04/09 职场文书
javascript条件式访问属性和箭头函数介绍
2021/11/17 Javascript