技术栈
web apis
韩曙亮
5 天前
前端
·
javascript
·
bom
·
window
·
web apis
·
pageyoffset
【Web APIs】元素滚动 scroll 系列属性 ② ( 右侧固定侧边栏 )
在右侧 显示 固定侧边栏 ,右侧固定侧边栏 一开始是 绝对定位 , 刚开始 向下滑动 时 , 随着 banner 一起滑动 ,
韩曙亮
6 天前
前端
·
javascript
·
动画
·
web apis
·
缓动动画
·
匀速动画
【Web APIs】JavaScript 动画 ② ( 缓动动画 | 步长计算取整 )
匀速动画 : 之前的博客 【Web APIs】JavaScript 动画 ① ( setInterval 实现动画原理 | 动画函数封装 | 元素自定义属性接收定时器标识 ) 中 实现的动画 是 匀速动画 , 为 obj 元素设置的 定时器 每次 向前移动 1 像素 ;
韩曙亮
7 天前
前端
·
javascript
·
web apis
·
mouseover
·
mouseout
·
mouseenter
·
mouseleave
【Web APIs】鼠标经过、离开事件 ( mouseover、mouseout 事件 | mouseenter、mouseleave 事件 )
mouseover 事件 : 鼠标指针 从 元素外部 移入元素本身 , 或 从 元素本身 移入其 子元素 时触发 , 支持 事件冒泡 ;
韩曙亮
9 天前
前端
·
javascript
·
dom
·
client
·
web apis
·
立即执行函数
·
元素可视区
【Web APIs】元素可视区 client 系列属性 ② ( 立即执行函数 )
立即执行函数 ( Immediately Invoked Function Expression , 简称 IIFE ) 是 定义后 立刻执行 的 JavaScript 函数 , 它的核心特点是 " 定义即执行 " , 且能 创建一个独立的私有作用域 ;
韩曙亮
10 天前
前端
·
javascript
·
css
·
html
·
offset
·
dom
·
web apis
【Web APIs】元素偏移量 offset 系列属性 ④ ( offset 属性案例 - 放大镜效果 )
实现如下放大镜效果 :小图容器 <div class="small"> 用于 承载小图、遮罩层、大图容器的父容器 , 对应 CSS 中的 .small 类 ;
韩曙亮
10 天前
前端
·
javascript
·
css
·
css3
·
bom
·
client
·
web apis
【Web APIs】元素可视区 client 系列属性 ( client 属性简介 | 常用的 client 属性 | 使用场景 | 代码示例 )
client 系列属性 是 元素可视区 相关的 属性 , 是 用来 获取 DOM 元素 可视区域尺寸 和 边框偏移的 只读属性 , 只关注 元素本身的可视内容部分 , 不包含 滚动条、外边距 等 无关区域 ;
韩曙亮
12 天前
开发语言
·
前端
·
javascript
·
异步任务
·
同步任务
·
web apis
·
js 引擎
【Web APIs】JavaScript 执行机制 ( 单线程特点 | 同步任务与异步任务 | 同步先行、异步排队 | 事件循环机制 )
浏览器 的 JavaScript 引擎 是单线程的 , 同一时间 只能 执行一个代码任务 ;将 JavaScript 设计成单线程 的 核心原因 是 避免 DOM 操作冲突 :
暖木生晖
22 天前
前端
·
dom
·
dom树
·
web apis
APIs之WEB API的基本认知是什么?
作用:就是使用JS去操作html和浏览器分类:DOM(文档对象模型)、BOM(浏览器对象模型)DOM(Document Object Model-文档对象模型)是用来呈现以及与任意HTML或XML文档交互的API。
韩曙亮
24 天前
前端
·
javascript
·
web apis
·
捕获阶段
·
目标阶段
·
冒泡阶段
·
dom 事件流
【Web APIs】JavaScript 事件高级 ③ ( DOM 事件流 | 捕获阶段 | 目标阶段 | 冒泡阶段 )
DOM 事件流 描述了 在页面中 发生某个事件 时 , 事件如何 在 DOM 树中的 元素之间 传播的过程 ;
韩曙亮
1 年前
前端
·
javascript
·
事件
·
web apis
·
事件源
·
时间处理程序
【Web APIs】JavaScript 事件基础 ② ( “ 事件 “ 开发步骤 | 常见鼠标 “ 事件 “ )
Web APIs 博客相关参考文档 :" 事件 " 开发步骤 :完整代码示例 :执行结果 :常见鼠标 " 事件 " :
韩曙亮
1 年前
前端
·
javascript
·
html
·
dom
·
body
·
web apis
【Web APIs】DOM 文档对象模型 ⑤ ( 获取特殊元素 | 获取 html 元素 | 获取 body 元素 )
本博客相关参考文档 :HTML 网页的基本结构如下 :在 HTML 标签结构中 ,通过 JavaScript 和 DOM 操作 可以获取上述两个 html 和 body 特殊标签 元素 ;
韩曙亮
1 年前
前端
·
javascript
·
element
·
dom
·
web apis
·
queryselector
·
nodelist
【Web APIs】DOM 文档对象模型 ④ ( querySelector 函数 | querySelectorAll 函数 | NodeList 对象 )
本博客相关参考文档 :在之前的博客中 , 都是通过 ID、 标签名、类名 获取 HTML 网页中的 DOM 元素 , 分别使用
我是有底线的