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 相关文章推荐
限制复选框的最大可选数
Jul 01 Javascript
走出JavaScript初学困境—js初学
Dec 29 Javascript
jquery实现心算练习代码
Dec 06 Javascript
jquery append 动态添加的元素事件on 不起作用的解决方案
Jul 30 Javascript
jquery+正则实现统一的表单验证
Sep 20 Javascript
原生javascript 学习之js变量全面了解
Jul 14 Javascript
使用jquery实现的循环连续可停顿滚动实例
Nov 23 Javascript
浅谈gulp创建完整的项目流程
Dec 20 Javascript
JavaScript遍历查找数组中最大值与最小值的方法示例
May 24 Javascript
使用apifm-wxapi快速开发小程序过程详解
Aug 05 Javascript
Vue实现星级评价效果实例详解
Dec 30 Javascript
浅谈Vue2.4.0 $attrs与inheritAttrs的具体使用
Mar 08 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和ACCESS写聊天室(六)
2006/10/09 PHP
20个PHP常用类库小结
2011/09/11 PHP
Window 7/XP 安装Apache 2.4与PHP 5.4 的过程详解
2013/06/02 PHP
php加密解密函数authcode的用法详细解析
2013/10/28 PHP
详解PHP导入导出CSV文件
2014/11/03 PHP
Ubuntu12下编译安装PHP5.3开发环境
2015/03/27 PHP
Laravel (Lumen) 解决JWT-Auth刷新token的问题
2019/10/24 PHP
完整显示当前日期和时间的JS代码
2007/09/17 Javascript
子窗口、父窗口和Silverlight之间的相互调用
2010/08/16 Javascript
jQuery实现用户注册的表单验证示例
2013/08/28 Javascript
基于javascript的COOkie的操作实现只能点一次
2014/12/26 Javascript
ES6新特性之解构、参数、模块和记号用法示例
2017/04/01 Javascript
js实现图片放大展示效果
2017/08/30 Javascript
JavaScript事件发布/订阅模式原理与用法分析
2018/08/21 Javascript
原生JS forEach()和map()遍历的区别、兼容写法及jQuery $.each、$.map遍历操作
2019/02/27 jQuery
微信小程序 scroll-view 水平滚动实现过程解析
2019/10/12 Javascript
分享Angular http interceptors 拦截器使用(推荐)
2019/11/10 Javascript
JavaScript实现矩形块大小任意缩放
2020/08/25 Javascript
vue 基于abstract 路由模式 实现页面内嵌的示例代码
2020/12/14 Vue.js
举例介绍Python中的25个隐藏特性
2015/03/30 Python
python与C互相调用的方法详解
2017/07/14 Python
Python中用字符串调用函数或方法示例代码
2017/08/04 Python
python构建深度神经网络(DNN)
2018/03/10 Python
python基础教程项目四之新闻聚合
2018/04/02 Python
Django 中使用流响应处理视频的方法
2018/07/20 Python
对Python定时任务的启动和停止方法详解
2019/02/19 Python
selenium2.0中常用的python函数汇总
2019/08/05 Python
Python 爬虫实现增加播客访问量的方法实现
2019/10/31 Python
Python模块常用四种安装方式
2020/10/20 Python
英国虚拟主机服务商:eUKhost
2016/08/16 全球购物
加拿大在线隐形眼镜和眼镜店:VisionPros
2019/10/06 全球购物
《月迹》教学反思
2014/02/19 职场文书
商学院大学生求职的自我评价
2014/03/12 职场文书
党员民主评议自我评价
2014/10/20 职场文书
2016猴年开门红标语口号
2015/12/26 职场文书
Python测试框架pytest核心库pluggy详解
2022/08/05 Golang