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编程起步(第六课)
Jan 10 Javascript
jquery下动态显示jqGrid以及jqGrid的属性设置容易出现问题的解决方法
Oct 22 Javascript
捕获浏览器关闭、刷新事件不同情况下的处理方法
Jun 02 Javascript
jquery 跳到顶部和底部动画2句代码简单实现
Jul 18 Javascript
javascript实现10个球随机运动、碰撞实例详解
Jul 08 Javascript
【经典源码收藏】jQuery实用代码片段(筛选,搜索,样式,清除默认值,多选等)
Jun 07 Javascript
JS无缝滚动效果实现方法分析
Dec 21 Javascript
JavaScript表单验证实现代码
May 22 Javascript
BootStrap Select清除选中的状态恢复默认状态
Jun 20 Javascript
ReactNative实现图片上传功能的示例代码
Jul 11 Javascript
基于 jQuery 实现键盘事件监听控件
Apr 04 jQuery
vue--vuex详解
Apr 15 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
详细介绍:Apache+PHP+MySQL配置攻略
2006/09/05 PHP
PHP连接SQLServer2005方法及代码
2013/12/26 PHP
PHP 5.3新增魔术方法__invoke概述
2014/07/23 PHP
10个实用的PHP正则表达式汇总
2014/10/23 PHP
php使用GD创建保持宽高比缩略图的方法
2015/04/17 PHP
php curl批处理实现可控并发异步操作示例
2018/05/09 PHP
PHP超全局变量实现原理及代码解析
2020/09/01 PHP
Javascript实现的分页函数
2006/12/22 Javascript
javascript中callee与caller的用法和应用场景
2010/12/08 Javascript
JS俄罗斯方块,包含完整的设计理念
2010/12/11 Javascript
jquery getScript动态加载JS方法改进详解
2012/11/15 Javascript
通过JS来判断页面控件是否获取焦点
2014/01/03 Javascript
jquery获取颜色在ie和ff下的区别示例介绍
2014/03/28 Javascript
JavaScript生成验证码并实现验证功能
2016/09/24 Javascript
jQuery实现模拟flash头像裁切上传功能示例
2016/12/11 Javascript
angular实现图片懒加载实例代码
2017/06/08 Javascript
Vue框架中正确引入JS库的方法介绍
2017/07/30 Javascript
vuex中的 mapState,mapGetters,mapActions,mapMutations 的使用
2018/04/13 Javascript
javascript实现画板功能
2020/04/12 Javascript
详解React路由传参方法汇总记录
2020/11/29 Javascript
pandas.loc 选取指定列进行操作的实例
2018/05/18 Python
浅谈Python脚本开头及导包注释自动添加方法
2018/10/27 Python
如何基于Python制作有道翻译小工具
2019/12/16 Python
python GUI库图形界面开发之PyQt5多线程中信号与槽的详细使用方法与实例
2020/03/08 Python
详解python对象之间的交互
2020/09/29 Python
小组合作学习反思
2014/02/18 职场文书
颁奖典礼主持词
2014/03/25 职场文书
有关环保的标语
2014/06/13 职场文书
应届毕业生自荐书
2014/06/18 职场文书
个人委托书如何写
2014/09/25 职场文书
依法行政工作汇报
2014/10/28 职场文书
2015年库房管理工作总结
2015/10/14 职场文书
2015年教师党员个人总结
2015/11/24 职场文书
员工升职自我评价
2019/03/26 职场文书
MySQL中几种插入和批量语句实例详解
2021/09/14 MySQL
三种方式清除vue路由跳转router-link的历史记录
2022/04/10 Vue.js