Web APIS(操作DOM、BOM)
文章平均质量分 96
本专栏内的文章主要是讲解如何操作DOM和BOM,实现各种交互效果,非常的简单有趣,容易上手。阅读完本专栏内容能让初学者快速上手做一些交互式的动画,游戏等,十分有趣!!!
前端小二哥
贵有恒,何必三更眠五更起最无益,只怕一日曝十日寒!
展开
-
Web APIs-1
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言一、Web API是什么?1.1 API的概念1.2 API 和 Web API总结二、DOM介绍2.1 什么是DOM2.2 DOM树三 、获取元素3.1 根据ID获取元素3.2 根据标签名获取元素3.3 H5新增获取元素方式3.4 特殊选择器(body、html)四 、事件基础4.1 事件概述4.2 事件三要素4.3 事件执行步骤4.4 常见的鼠标事件五 、操作元素5.1 改变元素内容(获取或者设置)5.1.1 innerT.原创 2022-04-01 16:37:49 · 278 阅读 · 4 评论 -
Web APIs-2
文章目录前言一、pandas是什么?二、使用步骤1.引入库2.读入数据总结前言提示:这里可以添加本文要记录的大概内容:例如:随着人工智能的不断发展,机器学习这门技术也越来越重要,很多人都开启了学习机器学习,本文就介绍了机器学习的基础内容。提示:以下是本篇文章正文内容,下面案例可供参考一、pandas是什么?示例:pandas 是基于NumPy 的一种工具,该工具是为了解决数据分析任务而创建的。二、使用步骤1.引入库代.原创 2022-04-02 18:40:18 · 295 阅读 · 11 评论 -
Web APIs-3
文章目录前言一、节点操作1.1 删除节点1.2 案例:删除留言1.3 复制克隆节点1.4 案例:动态生成表格二、创建元素的三种方式2.1 innerTHML和createElement效率对比三、DOM核心的总结3.1 创建元素3.2 增3.3 删3.4 改3.5 查(获取)3.6 属性操作3.7 事件操作(重点)四、事件高级4.1 注册事件的两种方式4.2 事件监听4.3 事件监听兼容性解决方案4.4 删除事件(解绑事件)4.5 删除事件的兼容性解决方案(解绑事件)4.6 DOM事件流4.6.1 DOM事原创 2022-04-04 18:10:54 · 331 阅读 · 21 评论 -
Web APIs-4
文章目录前言一、常用键盘事件1.1 键盘事件1.2 键盘事件对象属性1.3 案例:模拟京东按键输入内1.4 案例:模拟京东快递单号查询二、BOM2.1 什么是BOM2.2 BOM的构成2.3 顶级对象window2.4 window对象的常见事件2.4.1 window.onload2.4.2 DOMContenLoaded2.4.3 调整窗口大小事件2.4.4 定时器(两种)2.4.4.1 setTimeout()炸弹定时器2.4.4.2 清除炸弹定时器2.4.4.3 setInterval()闹钟定时器原创 2022-04-06 14:36:32 · 241 阅读 · 14 评论 -
Web APIs-5
文章目录前言一、元素偏移量offset系列1.1 offset概述1.2 offset和style的区别1.2.1 offset1.2.2 style1.3 案例:获取鼠标在盒子内的坐标二、元素可视区client系列2.1 client概述三、元素滚动 scroll 系列3.1 scroll概述3.2 页面被卷去的头部3.3 案例:仿淘宝固定右侧侧边栏3.4 案例分析:3.5 页面被卷去的头部兼容性解决方案四、 三大系列总结五 、mouseenter 和 mouseover的区别六 动画函数的封装6.1原创 2022-04-07 17:30:23 · 297 阅读 · 15 评论 -
Web APIs-6
文章目录前言一、动画函数封装1.1 动画实现缓动效果的原理1.2 动画函数多个目标值之间移动1.3 动画函数添加回调函数1.4 动画完整版代码二、常见网页特效案例2.1 案例:网页轮播图2.2 节流阀2.3 案例:返回顶部2.4 案例:筋斗云案例三、触屏事件3.1 触屏事件概述3.2 触摸事件对象(TouchEvent)3.3 案例:移动端移动元素前言学习目标:能够封装简单动画函数能够理解缓动动画的封装能够使用动画函数能够写出网页轮播图案例能够写出移动端触屏事件提示:以下是本篇文章正文原创 2022-04-09 15:42:35 · 214 阅读 · 8 评论 -
Web APIs-7
文章目录前言一、触屏事件1.1触屏事件概述1.2 触摸事件对象(TouchEvent)1.3 移动端移动元素二、 移动端常见特效2.1案例:移动端轮播图2.2 案例分析:2.3 classList 属性2.4 案例分析2.6 案例:返回顶部2.7 案例分析三、click 延时解决方案四、移动端常用开发插件4.1 什么是插件4.2 插件的使用4.3 swiper插件的使用4.4 其它移动端常见插件4.5 插件使用总结4.6 移动端视频插件 zy.media.js五、移动端常用的开发框架5.1 插件和框架的区别原创 2022-04-10 12:57:16 · 256 阅读 · 12 评论