DOM / BOM
这里是JavaScript进阶,JS Suki ! ! ! !
samarua
while "live" : print("Loli")
展开
-
【Web API】PC端网页特效
▊ 元素偏移量offset使用offset可动态的得到元素的位置(偏移)、大小等注:偏移是指相对于带有定位的父元素;大小是指自身整个盒子的宽高;返回值都不带单位box.offsetTop // 上偏移位置box.offsetLeft // 左偏移位置box.offsetWidth // 宽box.offsetHeight // 高box.offsetParent // 返回带有定位的父亲offsetWidth和style.width的区别(height同理)原创 2020-06-14 09:17:25 · 435 阅读 · 0 评论 -
【Web API】BOM小案例
❶ 倒计时<div class="box"> <div class="hour"></div> <div class="minute"></div> <div class="second"></div></div><script> var hour = document.querySelector('.hour'); var原创 2020-06-13 23:55:33 · 165 阅读 · 0 评论 -
【Web API】BOM事件
▊ BOM概述提供了独立于内容而与浏览器窗口进行交互的对象,其核心对象是window不像DOM那样是W3C的标准规范,兼容性较差BOM是包含DOM的,window包含document, location, navigation,screen, history ▊ 关于windowwindow是浏览器的顶级对象,它具有双重角色:它是JS访问浏览器窗口的一个接口它是一个全局对象:定义在全局作用域里的变量、函数都会变成window对象的属性、方法(调用的时候是省略wind原创 2020-06-11 08:18:11 · 275 阅读 · 0 评论 -
【Web API】DOM事件高级
▊ 注册事件的两种方式传统注册方式(前一阶段主要使用的):通常利用on开头的时间注册事件的唯一性:同一个元素同一个事件只能设置一个处理函数,后边会覆盖前面的方法监听注册方式利用addEventListener()方法同一个元素同一个事件可以注册多个监听器(function函数),依次执行 ▊ 删除事件(解绑事件)// [传统方法对应:]var div = document.querySelectorAll('div');div.onclick = fu原创 2020-06-10 11:39:24 · 197 阅读 · 0 评论 -
【Web API】DOM小案例
❶ 密码输入时的小眼睛// 核心思路:密码框和文本框的转换:即input的type属性的转换——password和text// 另一个就是flag的使用,不必多说 ❷ 切换背景// 核心思路: 修改body的backgroundImage属性document.body.style.backgroundImage = 'url(' + this.src + ')'; // 注意如何选出body;等号右边是拼接的字符串 ❸ 输入提示与判断原创 2020-06-09 15:33:04 · 248 阅读 · 1 评论 -
【Web API】DOM事件
▊ Web APIs与JS基础的关联JS的三个组成部分中,经常提到的JS基础是指ECMAScript,Web APIs阶段是DOM和BOMAPI(Application Programming Interface,应用程序编程接口)我们并不陌生,那么什么是Web API呢?其实用法思想差不多,Web API用来操作浏览器功能和页面元素的接口 ▊ DOM ▍DOM树文档 document :整个页面元素 element :页面中所有的标签的都是元素节点 n原创 2020-06-09 15:29:40 · 280 阅读 · 0 评论