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 相关文章推荐
用jquery存取照片的具体实现方法
Jun 30 Javascript
js禁止页面使用右键(简单示例代码)
Nov 13 Javascript
JavaScript人脸识别技术及脸部识别JavaScript类库Tracking.js
Sep 14 Javascript
jquery validate demo 基础
Oct 29 Javascript
30分钟快速掌握Bootstrap框架
May 24 Javascript
jQuery如何获取动态添加的元素
Jun 24 Javascript
KnockoutJS 3.X API 第四章之表单value绑定
Oct 10 Javascript
javascript函数的四种调用模式
Jan 08 Javascript
Vue AST源码解析第一篇
Jul 19 Javascript
讲解vue-router之什么是动态路由
May 28 Javascript
简单分析js中的this的原理
Aug 31 Javascript
layui操作列按钮个数和文字颜色的判断实例
Sep 11 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自动获取字符串编码函数mb_detect_encoding
2011/05/31 PHP
Session服务器配置指南与使用经验的深入解析
2013/06/17 PHP
修改ThinkPHP缓存为Memcache的方法
2014/06/25 PHP
PHP中echo,print_r与var_dump区别分析
2014/09/29 PHP
PHP通过API获取手机号码归属地
2015/05/28 PHP
Javascript 的addEventListener()及attachEvent()区别分析
2009/05/21 Javascript
jQuery下的几个你可能没用过的功能
2010/08/29 Javascript
jquery中表单 多选框的一种巧妙写法
2015/09/06 Javascript
详解AngularJS 模态对话框
2016/04/07 Javascript
React Native 截屏组件的示例代码
2017/12/06 Javascript
vue 引入公共css文件的简单方法(推荐)
2018/01/20 Javascript
js核心基础之闭包的应用实例分析
2019/05/11 Javascript
vue指令v-html使用过滤器filters功能实例
2019/10/25 Javascript
js实现星星打分效果
2020/07/05 Javascript
Python转换HTML到Text纯文本的方法
2015/01/15 Python
python清除字符串里非字母字符的方法
2015/07/02 Python
python框架django基础指南
2016/09/08 Python
python使用matplotlib绘制柱状图教程
2017/02/08 Python
使用python实现链表操作
2018/01/26 Python
利用arcgis的python读取要素的X,Y方法
2018/12/22 Python
Django使用消息提示简单的弹出个对话框实例
2019/11/15 Python
python每5分钟从kafka中提取数据的例子
2019/12/23 Python
python3.5的包存放的具体路径
2020/08/16 Python
Python装饰器如何实现修复过程解析
2020/09/05 Python
size?荷兰官方网站:英国高级运动鞋精品店
2020/07/24 全球购物
介绍一下Ruby的多线程处理
2013/02/01 面试题
大学军训感言
2014/01/10 职场文书
中英文求职信范文
2014/01/27 职场文书
心理学专业大学生职业生涯规划范文
2014/02/19 职场文书
婚纱摄影师求职信范文
2014/04/17 职场文书
代理协议书范本
2014/04/22 职场文书
夫妻忠诚协议书范本
2014/11/17 职场文书
2015年公司保安年终工作总结
2015/05/14 职场文书
给领导敬酒词
2015/08/12 职场文书
《称赞》教学反思
2016/02/17 职场文书
解决golang结构体tag编译错误的问题
2021/05/02 Golang