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天前
|
JavaScript 前端开发
jQuery和CSS3滑动展开菜单按钮插件
这是一款jQuery和CSS3滑动展开菜单按钮插件。该滑动展开菜单按钮在用户点击主菜单按钮之后,子菜单以滑动的方式依次展开
56 21
|
14天前
|
JavaScript 容器
jquery和CSS3图片排序过滤搜索插件
Filterizr是一款jquery和CSS3图片排序过滤插件。它可以对一组图片进行排序,按条件过滤和按关键字搜索。并在显示结果时使用指定的CSS3动画过渡效果。
24 2
|
14天前
|
JavaScript
jquery和CSS3响应式轮播图插件jcSlider
jcSlider是一款jquery和CSS3响应式轮播图插件。jcSlider使用CSS3过渡动画,它可以和animate.css完美结合,生成60多种轮播图过渡动画效果。
|
20天前
|
JavaScript
jQuery和CSS3精美翻页式电子时钟特效
jQuery和CSS3精美翻页式电子时钟特效
|
21天前
|
JavaScript 前端开发
jQuery和CSS3斑马线样式range滑块特效
jQuery和CSS3斑马线样式range滑块特效
|
2月前
|
JavaScript
jQuery+css3制作精美的2024圣诞节倒计时页面
jQuery+css3制作精美的2024圣诞节倒计时页面动画
26 0
jQuery+css3制作精美的2024圣诞节倒计时页面
|
2月前
|
前端开发
CSS 浮动属性讲解和使用
本文介绍了CSS中的浮动(float)属性,包括其基本功能、属性选项及其在网页布局中的应用。浮动使元素脱离文档流,向左或右排列,周围元素随之调整。文章还详细讲解了清除浮动的方法,如使用clear属性、设置父元素高度、利用overflow属性、伪元素等,以解决因浮动导致的布局问题。最后,强调了浮动在创建复杂布局时的作用,并预告后续内容。
39 2
|
2月前
|
前端开发
CSS transition过渡属性详解
本文介绍了CSS中`transition`属性的作用、用法及实例。`transition`用于在元素属性变化时添加平滑过渡动画,通过设置`transition-property`、`transition-duration`、`transition-timing-function`和`transition-delay`等属性值,可以精细控制过渡效果。文末提供了HTML示例代码,展示了如何使用`transition`实现鼠标悬停时背景颜色的平滑变化。
65 1
|
2月前
jQuery+CSS3模拟过山车动态的文字动画特效源码
jQuery+CSS3模拟过山车动态的文字动画特效源码实现在全黑的背景下,画面中的文本呈现过山车的轨迹动画上下滚动转圈,且伴随文本颜色渐变效果,非常有意思,欢迎对此特效感兴趣的朋友前来下载参考。
25 1
|
2月前
|
缓存 监控 前端开发
CSS 提高性能的方法
【10月更文挑战第24天】在实际应用中,还需要根据具体项目的特点和需求,灵活选择和组合这些方法,不断进行优化和改进。同时,随着技术的不断发展,也需要持续关注新的性能优化技巧和最佳实践,以保持在性能优化方面的领先地位。你对 CSS 性能优化还有哪些深入的思考和经验呢?欢迎进一步交流和分享。