jquery对dom的操作常用方法整理


Posted in Javascript onJune 25, 2013

Jquery对dom的操作也是很总要的。

1.三个简单实用的用于 DOM 操作的 jQuery 方法:

· text() - 设置或返回所选元素的文本内容

· html() - 设置或返回所选元素的内容(包括 HTML 标记)

· val() - 设置或返回表单字段的值

2.attr()获取属性。当然这两也是可以自己设置值来修改的,

3.对html内容的添加。添加新的 HTML 内容

我们将学习用于添加新内容的四个 jQuery 方法:

· append() - 在被选元素的结尾插入内容

· prepend() - 在被选元素的开头插入内容

· after() - 在被选元素之后插入内容

· before() - 在被选元素之前插入内容

4.删除元素/内容

如需删除元素和内容,一般可使用以下两个 jQuery 方法:

· remove() - 删除被选元素(及其子元素)

· empty() - 从被选元素中删除子元素

5.jQuery 操作 CSS

jQuery 拥有若干进行 CSS 操作的方法。我们将学习下面这些:

· addClass() - 向被选元素添加一个或多个类

· removeClass()- 从被选元素删除一个或多个类

· toggleClass()- 对被选元素进行添加/删除类的切换操作

· css() - 设置或返回样式属性

例子

$("h1,h2,p").addClass("blue");首先我们知道当对多种标签添加样式的时候我们用‘,'分开。Blue一定是一个设置好的.Blue{}类选择器

$("h1,h2,p").removeClass("blue");

$("h1,h2,p").toggleClass("blue");有样式就会移除,没样式就会添加

6.设置多个 CSS 属性

如需设置多个 CSS 属性,请使用如下语法:

css({"propertyname":"value","propertyname":"value",...});

7.jQuery 尺寸 方法

jQuerywidth() 和height() 方法

width() 方法设置或返回元素的宽度(不包括内边距、边框或外边距)。

height() 方法设置或返回元素的高度(不包括内边距、边框或外边距)。

jQueryinnerWidth() 和innerHeight() 方法

innerWidth() 方法返回元素的宽度(包括内边距)。

innerHeight() 方法返回元素的高度(包括内边距)。

jQueryouterWidth() 和outerHeight() 方法

outerWidth() 方法返回元素的宽度(包括内边距和边框)。

outerHeight() 方法返回元素的高度(包括内边距和边框)。

Javascript 相关文章推荐
js自动查找select下拉的菜单并选择(示例代码)
Feb 26 Javascript
js定时器(执行一次、重复执行)
Mar 07 Javascript
js遍历子节点子元素附属性及方法
Aug 19 Javascript
简述Matlab中size()函数的用法
Mar 20 Javascript
AngularJS 防止页面闪烁的方法
Mar 09 Javascript
运用jQuery写的验证表单(实例讲解)
Jul 06 jQuery
vue动态路由实现多级嵌套面包屑的思路与方法
Aug 16 Javascript
写给小白看的JavaScript异步
Nov 29 Javascript
ES6下子组件调用父组件的方法(推荐)
Feb 23 Javascript
vue-cli3.0 环境变量与模式配置方法
Nov 08 Javascript
js实现移动端轮播图
Dec 21 Javascript
关于layui时间回显问题的解决方法
Sep 24 Javascript
Extjs单独定义各组件的实例代码
Jun 25 #Javascript
SwfUpload在IE10上不出现上传按钮的解决方法
Jun 25 #Javascript
Jquery选择子控件"大于号"和" "区别介绍及使用示例
Jun 25 #Javascript
Jquery动态改变图片IMG的src地址示例
Jun 25 #Javascript
js实现快速分享功能(你的文章分享工具)
Jun 25 #Javascript
用js实现table单元格高宽调整,兼容合并单元格(兼容IE6、7、8、FF)实例
Jun 25 #Javascript
javascript实现div的显示和隐藏的小例子
Jun 25 #Javascript
You might like
PHP代码网站如何防范SQL注入漏洞攻击建议分享
2012/03/01 PHP
php变量范围介绍
2012/10/15 PHP
php批量更改数据库表前缀实现方法
2013/10/26 PHP
ThinkPHP3.1新特性之对分组支持的改进与完善概述
2014/06/19 PHP
php+ajax实时刷新简单实例
2015/02/25 PHP
PHP Web表单生成器案例分析
2020/06/02 PHP
ImageZoom 图片放大镜效果(多功能扩展篇)
2010/04/14 Javascript
jQuery之折叠面板的深入解析
2013/06/19 Javascript
javascript复制粘贴与clipboardData的使用
2014/10/16 Javascript
javascript运动详解
2015/07/06 Javascript
js前端实现多图图片上传预览的两个方法(推荐)
2016/11/18 Javascript
对Layer弹窗使用及返回数据接收的实例详解
2019/09/26 Javascript
ligerUI的ligerDialog关闭刷新的方法
2019/09/27 Javascript
从表单校验看JavaScript策略模式的使用详解
2020/10/17 Javascript
[01:07:13]TNC vs Pain 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/20 DOTA
[01:18:45]DOTA2-DPC中国联赛 正赛 DLG vs Dragon BO3 第三场2月1日
2021/03/11 DOTA
python基于xml parse实现解析cdatasection数据
2014/09/30 Python
python实现从ftp服务器下载文件的方法
2015/04/30 Python
利用numpy实现一、二维数组的拼接简单代码示例
2017/12/15 Python
python程序控制NAO机器人行走
2019/04/29 Python
python实现ip代理池功能示例
2019/07/05 Python
python匿名函数lambda原理及实例解析
2020/02/07 Python
详解通过focusout事件解决IOS键盘收起时界面不归位的问题
2019/07/18 HTML / CSS
Skyscanner香港:机票比价, 平机票和廉价航空机票预订
2020/02/07 全球购物
高一自我鉴定
2013/12/17 职场文书
百日安全活动总结
2014/05/04 职场文书
教师听课评语大全
2014/12/31 职场文书
2015感人爱情寄语
2015/02/26 职场文书
三方合作意向书范本
2015/05/09 职场文书
2015年妇委会工作总结
2015/05/22 职场文书
社区干部培训心得体会
2016/01/06 职场文书
大学生暑期社会实践的个人总结!
2019/07/17 职场文书
导游词之山东红叶谷
2019/10/31 职场文书
Html5页面播放M4a音频文件
2021/03/30 HTML / CSS
基于Python和openCV实现图像的全景拼接详细步骤
2021/10/05 Python
我收到了德劲DE1107
2022/04/05 无线电