jQuery学习笔记 操作jQuery对象 文档处理


Posted in Javascript onSeptember 19, 2012

下面就是一些常用方法,格式为$(selector).方法,其中$(selector)即当前选定元素:

 

移动元素

方法 描述
append($(selector)) 向当前元素的内部追加内容
appendTo($(selector)) 将当前元素在某元素内部追加。但由于会根据需要对当前元素进行移动,所以jQuery对象更改了,可用end()还原
prepend($(selector)) 向当前元素的内部前置内容
prependTo($(selector)) 将当前元素在某元素内部前置。类似于appendTo(),会改变对象
after($(selector)) 向当前元素之后插入内容
insertAfter($(selector)) 将当前元素插入到某元素之后。类似于appendTo(),会改变对象
before($(selector)) 向当前元素之前插入内容
insertBefore($(selector)) 将当前元素插入到某元素之前。类似于appendTo(),会改变对象

 

添加元素

方法 描述
$(html) 创建生成jQuery对象。根据原始HTML代码字符串,创建指向新元素的jQuery对象,再利用移动方法来添加到文档中
clone() 复制生成jQuery对象。复制当前选定页面元素,生成副本元素的jQuery对象,同样利用移动方法来添加到文档中。而且clone()指向副本,相当于更改了jQuery对象,所以可用一次end()还原到当前选定元素;二次end()则彻底还原对jQuery对象的更改

 

替换元素

方法 描述
replaceWith($(selector)) replaceWith($(html)) 移动页面上原有的元素来替换当前选定的页面元素,也可以添加新元素来替换
replaceAll($(selector)) replaceAll($(html)) 用当前选定的元素来替换某元素,可以使页面上原有元素,也可以是新元素。同样会根据需要复制当前元素副本,从而更改jQuery对象

 

包裹元素

方法 描述
wrap($(selector)) wrap($(html)) 复制页面上原有的元素来包裹当前选定的元素,也可以添加新元素来包裹
unwrap() 用来去除当前元素的父元素,但是父元素内部的文本内容依旧保留
wrapAll($(selector)) 复制页面原有元素把所有当前选定元素包裹在一起,不同于wrap()分别包裹每个元素
wrapInner($(selector)) 复制页面原有元素把分别包裹每个当前选定元素内部的文本和后代元素,不同于wrap()分别包裹每个元素本身

 

删除和清空元素

方法 描述
remove() 删除当前元素,该元素包含的文本内容和后代元素会一起删除掉,绑定的事件也不复存在
detach() 同样是删除当前元素,但是绑定的事件还是存在的
empty() 清空当前元素,该元素的文本内容和后代元素都将删除,但保留其本身
Javascript 相关文章推荐
javascript 计算两个整数的百分比值
Dec 26 Javascript
用jquery实现学校的校历(asp.net+jquery ui 1.72)
Jan 01 Javascript
js 自制滚动条的小例子
Mar 16 Javascript
setTimeout()递归调用不加引号出错的解决方法
Sep 05 Javascript
整理Javascript事件响应学习笔记
Dec 02 Javascript
微信小程序 Toast自定义实例详解
Jan 20 Javascript
Bootstrap入门教程一Hello Bootstrap初识
Mar 02 Javascript
vue中eslintrc.js配置最详细介绍
Dec 21 Javascript
如何写好一个vue组件,老夫的一年经验全在这了(推荐)
May 18 Javascript
JavaScript 替换所有匹配内容及正则替换方法
Feb 12 Javascript
JS中锚点链接点击平滑滚动并自由调整到顶部位置
Feb 06 Javascript
JavaScript ES6的函数拓展
Jan 18 Javascript
jQuery学习笔记 操作jQuery对象 属性处理
Sep 19 #Javascript
jQuery学习笔记 操作jQuery对象 CSS处理
Sep 19 #Javascript
firefox下jQuery UI Autocomplete 1.8.*中文输入修正方法
Sep 19 #Javascript
dotopAlert 提示用户需安装播放器的代码
Sep 17 #Javascript
点弹代码 点击页面任何位置都可以弹出页面效果代码
Sep 17 #Javascript
js函数的引用, 关于内存的开销
Sep 17 #Javascript
JavaScript中的稀疏数组与密集数组[译]
Sep 17 #Javascript
You might like
php 数组的合并、拆分、区别取值函数集
2010/02/15 PHP
教你在PHPStorm中配置Xdebug
2015/07/27 PHP
纯JavaScript实现HTML5 Canvas六种特效滤镜示例
2013/06/28 Javascript
JavaScript避免内存泄露及内存管理技巧
2014/09/05 Javascript
基于javascript实现的搜索时自动提示功能
2014/12/26 Javascript
js鼠标点击图片实现随机变换图片的方法
2015/02/16 Javascript
详解JavaScript基本类型和引用类型
2015/12/09 Javascript
详解JavaScript的内置对象
2016/12/07 Javascript
从零学习node.js之利用express搭建简易论坛(七)
2017/02/25 Javascript
AngularJS ionic手势事件的使用总结
2017/08/09 Javascript
改变vue请求过来的数据中的某一项值的方法(详解)
2018/03/08 Javascript
vue 中引用gojs绘制E-R图的方法示例
2018/08/24 Javascript
微信小程序自定义可滑动日历界面
2018/12/28 Javascript
JS实现简单随机3D骰子
2019/10/24 Javascript
JS实现字体背景跑马灯
2020/01/06 Javascript
vue通过接口直接下载java生成好的Excel表格案例
2020/10/26 Javascript
[00:43]拉比克至宝魔导师密钥展示
2018/12/20 DOTA
Python Web框架Pylons中使用MongoDB的例子
2013/12/03 Python
python利用高阶函数实现剪枝函数
2018/03/20 Python
Python多进程multiprocessing.Pool类详解
2018/04/27 Python
用于业余项目的8个优秀Python库
2018/09/21 Python
python+splinter自动刷新抢票功能
2018/09/25 Python
python opencv 图像拼接的实现方法
2019/06/27 Python
pytorch 数据处理:定义自己的数据集合实例
2019/12/31 Python
Pytorch DataLoader 变长数据处理方式
2020/01/08 Python
利用Tensorflow的队列多线程读取数据方式
2020/02/05 Python
Python实现图片查找轮廓、多边形拟合、最小外接矩形代码
2020/07/14 Python
Pycharm常用快捷键总结及配置方法
2020/11/14 Python
CSS3 border-image详解、应用及jQuery插件
2011/08/29 HTML / CSS
北美最大的零售退货翻新商:VIP Outlet
2019/11/21 全球购物
大家访活动实施方案
2014/03/10 职场文书
担保书怎么写
2014/04/01 职场文书
公司委托书格式范文
2014/04/04 职场文书
继续教育个人总结
2015/03/03 职场文书
2015大一新生军训感言
2015/08/01 职场文书
标准演讲稿格式结尾应该怎么书写?
2019/07/17 职场文书