Web前端105天-day48-jQuery
jQuery01
目录
前言
一、复习
二、jQuery
三、css操作
四、点击事件
五、class
六、show_hide
七、标签栏切换
八、自定有动画
九、属性操作
十、大小图切换
总结
前言
jQuery01学习开始
一、复习
- DOM: 文档 对象 模型
- HTML代码 转换成 document 对象, 然后再渲染到页面上
- 利用 JS 直接操作 document 来实现更加 灵活的操作
- 选择要操作的元素
- id:
document.getElementById- 父 parentElement
- 子 children
- 兄 previousElementSibling
- 弟 nextElementSibling
- css选择器
- 单个 querySelector
- 多个 querySelectorAll
- 操作属性
- 系统属性
- img 的 src : 切换 img 标签显示的图
- className: class属性的本体
- classList: 集合 -- 包含很多快捷操作class的方法
- innerText: 内容文本
- innerHTML: 内容中所有HTML代码
- 自定义属性
- 规范 :
data-（存放在dataset）- 不规范: 随意声明(1.getAttribute 2.setAttribute .)
- 事件
- click :点击
- focus : 焦点
- blur : 失去焦点
- change : 值变更
- keyup :键盘按键抬起
- scroll : 滚动
- mouseover :鼠标悬浮
二、jQuery
2006年发布的框架, 秉承着write less, do more---写的少, 做的多理念诞生- 把原生的 复杂的操作, 封装之后 , 得到更加简单的用法
- 使用 jQuery 必须参考其
说明书：jQuery API 中文文档 | jQuery API 中文在线手册 | jquery api 下载 | jquery api chm
三、css操作
css 09:13
- 泡泡
- 亮亮
- 铭铭
四、点击事件
click 事件
- 泡泡
- 铭铭
- 亮亮
五、class
class 09:38
- 练习
练习 10:11 
- 练习
练习 10:25
- 首页
- 关于净美仕
- 公司动态
- 产品中心
- 联系我们
- 练习
练习 10:48
- 1
- 2
- 3
- 4
- 5
- 6
- 7
六、show_hide
显示 与 隐藏 11:22
- 练习
菜单折叠 11:35 今日午餐:
- 黄焖鸡
- 炝莲白
- 羊汤泡馍
- 驴肉火烧
- 麻辣烫
- 练习
练习 11:45
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Nam ut quisquam exercitationem. Doloremque fugareprehenderit, perspiciatis iste voluptas adipisci est ullam nisi, saepe dolorum sint. Aliquam, minus quidem.Dolores, molestiae.
七、标签栏切换
标签栏切换 14:01
- 练习
练习 14:43
八、自定有动画
自定义动画 15:40
- 练习
练习 16:15
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Aliquam aperiam illum a veniam consequuntur minimalabore sapiente unde, vero harum aut atque illo enim omnis doloribus pariatur dolores ducimus? Veniam.
- 一款名为《我是渣渣辉》的游戏上架Windows 10应用商店，游戏广告页面上使用了张家辉的形象，并写着“装备RMB回收，交易1秒到
九、属性操作
属性操作 16:51
十、大小图切换
大小图切换练习 17:20
- 实现下图的效果
练习
总结
jQuery01学习结束
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！