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 相关文章推荐
ASP.NET中AJAX 调用实例代码
May 03 Javascript
Js nodeType 属性全面解析
Nov 14 Javascript
jQuery 中国省市两级联动选择附图
May 14 Javascript
JS往数组中添加项性能分析
Feb 25 Javascript
详解Node.js模块间共享数据库连接的方法
May 24 Javascript
jQuery可见性过滤选择器用法示例
Sep 09 Javascript
canvas实现图像截取功能
Feb 06 Javascript
JS常见算法详解
Feb 28 Javascript
JS基于对象的链表实现与使用方法示例
Jan 31 Javascript
微信小程序设置全局请求URL及封装wx.request请求操作示例
Apr 02 Javascript
解决vue单页面应用中动态修改title问题
Jun 09 Javascript
JS实现的tab切换并显示相应内容模块功能示例
Aug 03 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 获取当前访问的url文件名的方法小结
2010/02/08 PHP
PHP PDO fetch 模式各种参数的输出结果一览
2015/01/07 PHP
PHP获取当前相对于域名目录的方法
2015/06/26 PHP
php结合web uploader插件实现分片上传文件
2016/05/10 PHP
CI框架中类的自动加载问题分析
2016/11/21 PHP
tp5框架内使用tp3.2分页的方法分析
2019/05/05 PHP
PHP+Apache实现二级域名之间共享cookie的方法
2019/07/24 PHP
当达到输入长度时表单自动切换焦点
2014/04/06 Javascript
Node.js开源应用框架HapiJS介绍
2015/01/14 Javascript
PHP结合jQuery实现红蓝投票功能特效
2015/07/22 Javascript
js实现控制textarea输入字符串的个数,鼠标按下抬起判断输入字符数
2016/10/25 Javascript
微信小程序遇到修改数据后页面不渲染的问题解决
2017/03/09 Javascript
封装运动框架实战左右与上下滑动的焦点轮播图(实例)
2017/10/17 Javascript
基于Vue自定义指令实现按钮级权限控制思路详解
2018/05/23 Javascript
Vue组件全局注册实现警告框的实例详解
2018/06/11 Javascript
jQuery Ajax async=>false异步改为同步时,解决导致浏览器假死的问题
2019/07/22 jQuery
JS实现简易计算器
2020/02/14 Javascript
vue.js+element 默认提示中英文操作
2020/11/11 Javascript
查看django版本的方法分享
2018/05/14 Python
PyCharm设置SSH远程调试的方法
2018/07/17 Python
浅谈PYTHON 关于文件的操作
2019/03/19 Python
Python3内置模块之json编解码方法小结【推荐】
2020/12/09 Python
Pytorch maxpool的ceil_mode用法
2020/02/18 Python
Pycharm+Python工程,引用子模块的实现
2020/03/09 Python
解决python和pycharm安装gmpy2 出现ERROR的问题
2020/08/28 Python
Html5 canvas实现粒子时钟的示例代码
2018/09/06 HTML / CSS
StubHub巴西:购买和出售您的门票
2016/07/22 全球购物
IMPORT的选项IGNORE有什么作用?缺省是什么设置?
2015/09/17 面试题
建筑实习自我鉴定
2013/10/18 职场文书
幼儿园门卫制度
2014/01/29 职场文书
认识深刻的检讨书
2014/02/16 职场文书
终止劳动合同证明书样本
2014/11/19 职场文书
元宵节寄语大全
2015/02/27 职场文书
调解书格式范本
2015/05/20 职场文书
2015年度学校应急管理工作总结
2015/10/22 职场文书
python opencv人脸识别考勤系统的完整源码
2021/04/26 Python