博学谷 > 免费课 > 探索JavaScript操作页面元素的奥秘

Javascript-DOM操作

探索JavaScript操作页面元素的奥秘

该课程详细全面的介绍DOM的基础知识,让您重新认识DOM,学会元素节点的类型判断、继承层次和分类以及DOM事件具体相关知识,DOM事件的使用方法及应用。为了让您在实际开发过程中灵活运用,课程准备了相应案例,更透彻的分析了知识点。

主讲:前端高级讲师 | 课程时长:12课时| 学习人数:566人 | 难度: 进阶

免费

立即报名

第 一 章:探索JavaScript操作页面元素的奥秘

1-1 Javascript-DOM操作

1-1-1 DOM简介
1-1-2 DOM初体验
1-1-3 标签位置
1-1-4 小猫发威
1-1-5 京东商品展示1
1-1-6 京东商品展示2

1-2 阻止a标签的默认行为及案例

1-2-1 阻止a标签的默认行为1
1-2-2 相册案例

1-3 事件三要素的使用及案例

1-3-1 事件三要素
1-3-2 批量获取元素
1-3-3 批量注册事件
1-3-4 限定范围
1-3-5 京东商品展示升级1
1-3-6 京东商品展示升级2

1-4 阻止a标签的默认行为及案例升级

1-4-1 阻止a标签的默认行为2
1-4-2 相册案例升级

1-5 类名的设置、切换、替换及封装

1-5-1 设置类名
1-5-2 显示隐藏切换1
1-5-3 显示隐藏切换2
1-5-4 显示隐藏二维码
1-5-5 替换类名
1-5-6 方法封装

1-6 innerText、innerHTML和textContent的区别

1-6-1 innerText和innerHTML
1-6-2 innerText和textContent
1-6-3 兼容处理1
1-6-4 封装兼容方法

1-7 禁用文本框

1-7-1 点击禁用文本框(disabled)
1-7-2 批量禁用文本框(type)

1-8 value属性

1-8-1 value属性

1-9 大量拼接字符串

1-9-1 大量拼接字符串

1-10 仿京东搜索框

1-10-1 仿京东搜索框 1
1-10-2 仿京东搜索框 2

1-11 全选与反选

1-11-1 点击选中选项(selected)
1-11-2 全选反选1
1-11-3 全选反选2

1-12 排他思想与案例

1-12-1 排他思想
1-12-2 tab栏切换1
1-12-3 tab栏切换2

1-13 属性操纵方法及案例

1-13-1 自定义属性
1-13-2 专门用来操作标签属性的方法
1-13-3 tab栏切换3

1-14 隔行变色

1-14-1 隔行变色

1-15 节点属性及菜单切换案例

1-15-1 子节点
1-15-2 节点属性
1-15-3 菜单切换

1-16 子元素和随机选中案例

1-16-1 子元素
1-16-2 随机选中

1-17 表单验证

1-17-1 表单验证(nextSibling)
1-17-2 表单验证(nextElementSibling)
1-17-3 兼容处理2

1-18 封装工具包

1-18-1 封装工具包

1-19 开灯关灯案例

1-19-1 开灯关灯

1-20 获取和设置行内样式

1-20-1 获取样式属性
1-20-2 设置样式属性

1-21 案例练习1

1-21-1 改变盒子大小
1-21-2 切换背景图
1-21-3 百度换肤

1-22 透明度

1-22-1 透明度

1-23 案例练习2

1-23-1 隐藏盒子
1-23-2 关闭二维码
1-23-3 当前文本框高亮
1-23-4 隔行变色
1-23-5 当前高亮

1-24 设置盒子位置及层级

1-24-1 设置盒子位置
1-24-2 设置盒子层级

1-25 节点的插入移除和克隆

1-25-1 节点的插入移除和克隆

1-26 许愿墙案例1

1-26-1 许愿墙(克隆纸条)
1-26-2 许愿墙(位置层级)
1-26-3 许愿墙(双击关闭)
1-26-4 许愿墙(兼容处理1)
1-26-5 许愿墙(兼容处理2)

1-27 动态创建页面结构

1-27-1 动态创建页面结构

1-28 效率问题

1-28-1 效率问题(一)
1-28-2 效率问题(二)

1-29 createElement

1-29-1 createElement

1-30 动态文本框和列表

1-30-1 动态创建文本框
1-30-2 动态创建列表

1-31 选好友案例

1-31-1 选好友1全到右边
1-31-2 选好友2后面三个
1-31-3 选好友3函数封装
1-31-4 选好友4函数封装
1-31-5 选好友5innerHTML

1-32 百度搜索

1-32-1 百度搜索1indexOf方法
1-32-2 百度搜索2寻找匹配项
1-32-3 百度搜索3动态创建结构
1-32-4 百度搜索4解决问题

1-33 微博发布

1-33-1 微博发布1主体逻辑
1-33-2 微博发布2修改问题
1-33-3 微博发布3删除按钮

1-34 在线会员

1-34-1 在线会员列表1动态创建
1-34-2 在线会员列表2内容写活
1-34-3 在线会员列表3快捷操作

1-35 许愿墙案例2

1-35-1 许愿墙1动态创建
1-35-2 许愿墙2内容写活
1-35-3 许愿墙3添加功能
1-35-4 许愿墙4兼容封装

1-36 顶级对象

1-36-1 顶级对象

1-37 窗机事件

1-37-1 窗机事件

1-38 打开窗口

1-38-1 打开窗口

1-39 定时器

1-39-1 延时定时器
1-39-2 间歇定时器
1-39-3 短信验证

1-40 location对象

1-40-1 location对象

1-41 定时跳转

1-41-1 定时跳转

1-42 三个对象

1-42-1 三个对象

1-43 移动盒子

1-43-1 移动盒子
1-43-2 移动广告1
1-43-3 移动广告2

1-44 日期对象

1-44-1 日期对象
1-44-2 日期对象方法

1-45 电子表案例

1-45-1 电子表

1-46 机械表

1-46-1 机械表
1-46-2 机械表完善

1-47 基本包装对象

1-47-1 基本包装对象
1-47-2 包装对象的歧义

1-48 字符串常用方法

1-48-1 字符串的截取方法
1-48-2 字符串的位置方法
1-48-3 字符串的替换方法
1-48-4 字符串的字符方法
1-48-5 字符串练习

1-49 替换和查找类名

1-49-1 替换类名回顾
1-49-2 替换类名改进
1-49-3 查找类名
1-49-4 查找类名改进

1-50 字符串的其他方法

1-50-1 字符串的其他方法

1-51 变量声明、提升及作用域

1-51-1 声明提升
1-51-2 变量作用域
1-51-3 没有块级作用域
1-51-4 作用域链新

1-52 面试题讲解

1-52-1 面试题(一)
1-52-2 面试题(二)
1-52-3 面试题(三)
1-52-4 面试题(四)
1-52-5 面试题(五)