jQuery的$工具方法&CSS属性及方法

简介: jQuery的$工具方法&CSS属性及方法

一. js与jQuery的转换

1.1 概述

$类似Java中的类

$()类似Java中的类的构造方法

1.2 js与jQuery的转换

js转换jQuery====>$(js对象)

jQuery转换js====>通过下标转换js对象,通过get方法加下标获取

二. $工具方法

1. $.each(): 遍历数组,对象,对象数组中的数据
2. $.trim(): 去除字符串两边的空格
3. $.type(obj): 得到数据的类型
4. $.isArray(obj): 判断是否为数组
5. $.isFunction(obj): 判断是否是函数
6. $.parseJSON(obj): 解析json字符串转换为js对象/数组

三. jQuery属性和CSS

3.1 属性

1.attr(): 获取某个标签属性的值,或设置某个标签属性的值

2.removeAttr(): 删除某个标签属性

3.addClass(): 给某个标签添加class属性值

4.removeClass(): 删除某个标签class属性值

5.prop(): 和attr()类似,区别在于prop用于属性值为boolean类型的情况,比如多选

6.html(): 获取某一个标签体的内容(注意:该标签体可以包含子标签)

7.text(): 获取某一个标签体内容(注意:该标签体不能包含子标签)

8.val(): 用户获取/设置输入框的值

3.2 CSS

1.css(): 设置标签的css样式

1.1 获取样式值:css(“样式名”)

1.2 设置单个样式:css(“样式名”,“样式值”)

1.3 设置多个样式:css({“样式名”:“样式值”,“样式名”:“样式值”})

2.位置

2.1 offset(): 相对整个大容器的相对位置

2.2 position(): 相对父容器的相对位置

2.3 srcollXX: 滚动条到XX距离

3.1 内容尺寸

width(): 容器宽

height(): 容器高

3.2 内部尺寸

innerWidth(): width + padding

innerHeight(): height + padding

3.3 外部尺寸(注意:参数为true,再加上margin)

outerWidth(): width + padding + border

outerHeight(): height + padding + border

相关文章
|
17天前
|
Web App开发 前端开发 iOS开发
css所有缩写属性,CSS属性简写整理
css所有缩写属性,CSS属性简写整理
16 1
|
1月前
|
存储 JavaScript 前端开发
jQuery 对属性的操作
【10月更文挑战第8天】
|
17天前
|
前端开发
css简写属性
css简写属性
24 0
|
1月前
|
JavaScript 前端开发 API
深入了解jQuery:简化Web开发的强大工具
【10月更文挑战第11天】深入了解jQuery:简化Web开发的强大工具
11 0
|
1月前
|
前端开发 JavaScript
如何在CSS中添加自定义属性
如何在CSS中添加自定义属性
15 0
|
1月前
|
前端开发
运用CSS伪类与属性,巧妙实现背景图片旋转效果
运用CSS伪类与属性,巧妙实现背景图片旋转效果
27 0
|
1月前
|
前端开发
哪些 CSS 属性可以继承?
哪些 CSS 属性可以继承?
41 0
|
JavaScript 前端开发 UED
9款设计独特的jQuery/CSS3插件
今天要为大家分享9款设计非常独特的jQuery/CSS3全新应用插件,插件包含菜单、jQuery焦点图、jQuery表单、jQuery图片特效等。下面大家一起来看看吧。
177 0
9款设计独特的jQuery/CSS3插件
|
JavaScript 前端开发
推荐20款基于 jQuery & CSS 的文本效果插件
  jQuery 和 CSS 可以说是设计和开发行业的一次革命。这一切如此简单,快捷的一站式服务。jQuery 允许你在你的网页中添加一些真正令人惊叹的东西而不用付出很大的努力,要感谢那些优秀的 jQuery 插件。
1427 0
|
JavaScript 前端开发 数据格式
jquery+css3打造一款ajax分页插件
原文:[原创]jquery+css3打造一款ajax分页插件 最近公司的项目将好多分页改成了ajax的前台分页以前写的分页插件就不好用了,遂重写一个 支持IE6+,但没有动画效果如果没有硬需求,个人认为没必要多写js让动画在这些浏览器中实现css3的动画本来就是帮我们取代js中这部分动画代码的使j...
946 0