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 相关文章推荐
JS HTML5 音乐天气播放器(Ajax获取天气信息)
May 26 Javascript
浅析JS刷新框架中的其他页面 && JS刷新窗口方法汇总
Jul 08 Javascript
jQuery大于号(>)选择器的作用解释
Jan 13 Javascript
JavaScript简单修改窗口大小的方法
Aug 03 Javascript
jQuery插件实现多级联动菜单效果
Dec 01 Javascript
JQuery解析XML数据的几个简单实例
May 18 Javascript
jQuery实例—选项卡的简单实现(js源码和jQuery)
Jun 14 Javascript
jQuery实现的tab标签切换效果示例
Sep 05 Javascript
JS 实现导航菜单中的二级下拉菜单的几种方式
Oct 31 Javascript
bootstrap的工具提示实例代码
May 17 Javascript
jQuery删除/清空指定元素的所有子节点实例代码
Jul 04 jQuery
vue移动端城市三级联动组件使用详解
Jul 26 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
收音机指标测试方法及仪器
2021/03/01 无线电
php.ini 中文版
2006/10/28 PHP
echo, print, printf 和 sprintf 区别
2006/12/06 PHP
ie6 动态缩略图不显示的原因
2009/06/21 PHP
解析web文件操作常见安全漏洞(目录、文件名检测漏洞)
2013/06/29 PHP
php正则取img标记中任意属性(正则替换去掉或改变图片img标记中的任意属性)
2013/08/13 PHP
php操作mysqli(示例代码)
2013/10/28 PHP
php获取新浪微博数据API实例
2013/11/12 PHP
php中实现精确设置session过期时间的方法
2014/07/17 PHP
php Session无效分析资料整理
2016/11/29 PHP
PHP简单实现循环链表功能示例
2017/11/10 PHP
PHPStorm 2020.1 调试 Nodejs的多种方法详解
2020/09/17 NodeJs
javascript 常用方法总结
2009/06/03 Javascript
用Mootools获得操作索引的两种方法分享
2011/12/12 Javascript
js动态修改input输入框的type属性(实现方法解析)
2013/11/13 Javascript
js使用正则实现ReplaceAll全部替换的方法
2014/08/22 Javascript
JS实现复制内容到剪贴板功能兼容所有浏览器(推荐)
2016/06/17 Javascript
使用nodejs爬取前程无忧前端技能排行
2017/05/06 NodeJs
快速掌握jquery分页插件jqPaginator的使用方法
2017/08/09 jQuery
JavaScript类型相关的常用操作总结
2019/02/14 Javascript
Vue中的组件及路由使用实例代码详解
2019/05/22 Javascript
VUE+elementui组件在table-cell单元格中绘制微型echarts图
2020/04/20 Javascript
老生常谈Python进阶之装饰器
2017/05/11 Python
Python入门必须知道的11个知识点
2018/03/21 Python
Python paramiko模块的使用示例
2018/04/11 Python
python2.7实现爬虫网页数据
2018/05/25 Python
基于tensorflow加载部分层的方法
2018/07/26 Python
Python 硬币兑换问题
2019/07/29 Python
html5中 media(播放器)的api使用指南
2014/12/26 HTML / CSS
美国演唱会和体育门票购买网站:Ticketnetwork
2018/10/19 全球购物
英国豪华家具和经典家居饰品购物网站:OKA
2020/06/05 全球购物
致100米运动员广播稿
2014/02/14 职场文书
保护环境倡议书500字
2014/05/19 职场文书
Qt自定义Plot实现曲线绘制的详细过程
2021/11/02 Python
【海涛解说】暗牧也疯狂,牛蛙成配角
2022/04/01 DOTA
MySQL数据库实验实现简单数据库应用系统设计
2022/06/21 MySQL