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 相关文章推荐
文本框的字数限制功能jquery插件
Nov 24 Javascript
javascript下判断一个元素是否存在的代码
Mar 05 Javascript
Jquery优化效率 提升性能解决方案
Sep 06 Javascript
jQuery1.5.1 animate方法源码阅读
Apr 05 Javascript
javascript针对DOM的应用分析(二)
Apr 15 Javascript
js控制的回到页面顶端goTop的代码实现
Mar 20 Javascript
JS 实现Json查询的方法实例
Apr 12 Javascript
jQuery输入城市查看地图使用介绍
May 08 Javascript
如何通过javascript操作web控件的自定义属性
Nov 25 Javascript
javascript判断css3动画结束 css3动画结束的回调函数
Mar 10 Javascript
jQuery实现获取元素索引值index的方法
Sep 18 Javascript
jquery实现左右轮播切换效果
Jan 01 jQuery
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
上海牌131型七灯四波段四喇叭一级收音机
2021/03/02 无线电
php mysqli查询语句返回值类型实例分析
2016/06/29 PHP
php each 返回数组中当前的键值对并将数组指针向前移动一步实例
2016/11/22 PHP
PHP分享图片的生成方法
2018/04/25 PHP
document.all与WEB标准
2020/05/13 Javascript
用javascript实现改变TEXTAREA滚动条和按钮的颜色,以及怎样让滚动条变得扁平
2007/04/20 Javascript
JavaScript 调试器简介
2009/02/21 Javascript
jquery获取特定name所有选中的checkbox,支持IE9标准模式
2013/03/18 Javascript
JavaScript表单通过正则表达式验证电话号码
2014/03/14 Javascript
一个可以增加和删除行的table并可编辑表格中内容
2014/06/16 Javascript
JavaScript使用slice函数获取数组部分元素的方法
2015/04/06 Javascript
JavaScript中getUTCSeconds()方法的使用详解
2015/06/11 Javascript
AngularJS学习笔记之依赖注入详解
2016/05/16 Javascript
jquery广告无缝轮播实例
2017/01/05 Javascript
在Vue中使用echarts的实例代码(3种图)
2017/07/10 Javascript
利用nodeJs anywhere搭建本地服务器环境的方法
2018/05/12 NodeJs
JavaScript设计模式之观察者模式(发布订阅模式)原理与实现方法示例
2018/07/27 Javascript
微信小程序实现左滑动删除效果
2020/03/30 Javascript
layui实现数据表格点击搜索功能
2020/03/26 Javascript
Vue 实现从文件中获取文本信息的方法详解
2019/10/16 Javascript
python操作mysql数据库
2017/03/05 Python
python3+PyQt5实现自定义分数滑块部件
2018/04/24 Python
python中in在list和dict中查找效率的对比分析
2018/05/04 Python
替换python字典中的key值方法
2018/07/06 Python
Python图像处理之颜色的定义与使用分析
2019/01/03 Python
django 中QuerySet特性功能详解
2019/07/25 Python
结合OpenCV与TensorFlow进行人脸识别的实现
2019/10/10 Python
Python的历史与优缺点整理
2020/05/26 Python
IE9对HTML5中部分属性不支持的原因分析
2014/10/15 HTML / CSS
美国批发供应商:Kole Imports
2019/04/10 全球购物
奥地利购买珠宝和手表网站:ELLA JUWELEN
2019/09/03 全球购物
阿联酋最好的手机、电子产品和家用电器网上商店:Eros Digital Home
2020/08/09 全球购物
人资专员岗位职责
2014/04/04 职场文书
印刷技术专业自荐信
2014/09/18 职场文书
Python 内置函数速查表一览
2021/06/02 Python
浅谈Redis跟MySQL的双写问题解决方案
2022/02/24 Redis