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 相关文章推荐
JavaScript中的eval()函数使用介绍
Dec 31 Javascript
JavaScript省市级联下拉菜单实例
Feb 14 Javascript
vue插件vue-resource的使用笔记(小结)
Aug 04 Javascript
前端图片懒加载(lazyload)的实现方法(提高用户体验)
Aug 21 Javascript
详解js类型判断
May 22 Javascript
通过webpack引入第三方库的方法
Jul 20 Javascript
小程序文字跑马灯效果
Dec 28 Javascript
基于Vue SEO的四种方案(小结)
Jul 01 Javascript
JavaScript 预解析的4种实现方法解析
Sep 03 Javascript
小程序开发之模态框组件封装
Apr 23 Javascript
vue将文件/图片批量打包下载zip的教程
Oct 21 Javascript
Vue基本指令实例图文讲解
Feb 25 Vue.js
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
PHP中读取文件的8种方法和代码实例
2014/08/05 PHP
IIS下PHP的三种配置方式对比
2014/11/20 PHP
纯php生成随机密码
2015/10/30 PHP
php 实现进制相互转换
2016/04/07 PHP
php引用和拷贝的区别知识点总结
2019/09/23 PHP
如何在centos8自定义目录安装php7.3
2019/11/28 PHP
php设计模式之模板模式实例分析【星际争霸游戏案例】
2020/03/24 PHP
JavaScript 监听textarea中按键事件
2009/10/08 Javascript
超轻量级的基于jquery的三级展开列表
2011/04/26 Javascript
阻止事件(取消浏览器对事件的默认行为并阻止其传播)
2013/11/03 Javascript
JavaScript学习笔记之JS函数
2015/01/22 Javascript
JS实现点击按钮自动增加一个单元格的方法
2015/03/09 Javascript
JavaScript中的lastIndexOf()方法使用详解
2015/06/06 Javascript
JavaScript和HTML DOM的区别与联系及Javascript和DOM的关系
2015/11/15 Javascript
浅谈jquery采用attr修改form表单enctype不起作用的问题
2016/11/25 Javascript
JavaScript学习笔记--常用的互动方法
2016/12/07 Javascript
原生js仿浏览器滚动条效果
2017/03/02 Javascript
微信小程序request出现400的问题解决办法
2017/05/23 Javascript
利用jquery去掉时光轴头尾部线条的方法实例
2017/06/16 jQuery
bootstrap table表格客户端分页实例
2017/08/07 Javascript
JavaScript正则表达式的贪婪匹配和非贪婪匹配
2017/09/05 Javascript
Layui带搜索的下拉框的使用以及动态数据绑定方法
2019/09/28 Javascript
原生JS实现相邻月份日历
2020/10/13 Javascript
JavaScript 如何在浏览器中使用摄像头
2020/12/02 Javascript
python实现爬取千万淘宝商品的方法
2015/06/30 Python
简单实现python爬虫功能
2015/12/31 Python
用Python写一个无界面的2048小游戏
2016/05/24 Python
pytorch 使用加载训练好的模型做inference
2020/02/20 Python
python 怎样进行内存管理
2020/11/10 Python
全球酒店预订网站:Hotels.com
2016/08/10 全球购物
压铸汽车模型收藏家:Diecastmodelswholesale.com
2016/12/21 全球购物
Charles & Colvard官网:美国莫桑石品牌
2019/06/05 全球购物
初中生操行评语大全
2014/04/24 职场文书
财务统计员岗位职责
2015/04/14 职场文书
Feign调用全局异常处理解决方案
2021/06/24 Java/Android
集英社今正式宣布 成立游戏公司“集英社Games”
2022/03/31 其他游戏