学习记录JavaScript
文章平均质量分 92
退堂鼓职业选手
O Captain, My Captain
展开
-
JavaScript(元素偏移,滚动,可视区系列。淘宝右侧固定栏案例,mouseover与mouseenter的区别)
JSday14文章目录JSday14元素偏移量offset系列元素可视区client系列立即执行函数元素滚动scroll系列==案例1==:仿淘宝固定右侧侧边栏mouseenter与mouseover的区别元素偏移量offset系列参考上一章京东放大镜效果元素可视区client系列通过client系列的相关属性可以动态的得到该元素的边框大小,元素大小等。与offset最大的区别就是不包含边框client系列属性作用element.clientTop返回元素上边框的大小原创 2021-08-06 14:51:30 · 183 阅读 · 0 评论 -
JavaScript(京东商品放大镜效果)
JSday13案例1:京东商品放大镜效果案例分析:整个案例可以分为三个功能模块;鼠标经过小图片盒子,黄色的遮挡层和大图片盒子显示,离开时2个盒子隐藏功能;黄色的遮挡层跟随鼠标移动功能;移动黄色遮挡层,大图片跟随移动功能。<html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale原创 2021-08-06 10:25:05 · 582 阅读 · 0 评论 -
JavaScript(this指向问题、JS执行机制、location,history对象)
JSday12文章目录JSday12this指向问题JS执行队列JS是单线程同步和异步同步异步JS执行机制(事件循环even loop)location对象location对象属性:location对象的方法history对象this指向问题this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,一般情况下this的最终指向的是那个调用它的对象。全局作用域或者普通函数中this指向全局对象window(注意定时器里面的thi指向window)方法调用中谁调用th原创 2021-08-05 11:18:32 · 223 阅读 · 0 评论 -
JavaScript(BOM浏览器对象模型、定时器(包含京东倒计时效果案例和发送短信案例))
JSday11文章目录JSday11BOM浏览器对象模型BOM概述window对象常见事件窗口加载事件调整窗口大小事件定时器两种定时器停止setTimeout()定时器==案例1==:京东倒计时效果停止setInterval()定时器==案例2==:发送短信BOM浏览器对象模型BOM概述BOM即浏览器对象模型,它提供了独立于内容而与浏览器窗口进行交互的对象,其核心为window。BOM缺乏标准,JavaScript语法的标准化组织是ECMA,DOM的标准化组织是W3C,BOM最初是Netscape原创 2021-08-04 17:50:42 · 257 阅读 · 0 评论 -
JavaScript(事件委托、冒泡、事件流、常用鼠标,键盘事件)
JSday10文章目录JSday10事件高级技巧(续)删除事件(解绑事件)传统注册方式方法监听注册方式DOM事件流事件对象事件对象常见属性和方法阻止默认行为阻止事件冒泡事件委托(代理、委派)常用的鼠标事件鼠标事件对象常用的键盘事件键盘事件对象事件高级技巧(续)删除事件(解绑事件)传统注册方式eventTarget.onclick = null;方法监听注册方式eventTarget.removeEventListener(type,listener[,useCapture]);<div原创 2021-08-02 10:49:59 · 293 阅读 · 0 评论 -
JavaScript(元素创建、事件高级技巧)
JSday9文章目录JSday9==案例1== 动态生成表格三种动态创建元素区别事件高级技巧注册事件(绑定事件)传统注册方式方法监听注册方式案例1 动态生成表格数据是动态的,需要JS动态生成所有的数据都是放到tbody的行里面循环创建多行(对应数据行数)<html> <head> <meta charset="utf-8"> <title></title> <style> *{原创 2021-07-31 14:44:28 · 179 阅读 · 4 评论 -
JavaScript节点操作
JSday8文章目录JSday8DOM-节点操作获取元素的两种方式节点层级父级节点子节点==案例1==:下拉菜单兄弟节点创建节点添加节点删除节点复制节点==案例2==:发布留言DOM-节点操作获取元素的两种方式利用DOM提供的方法获取元素document.getElementById()document.getElementByTagName()document.querySelector等逻辑性不强,繁琐利用节点层级关系获取元素利用父子兄弟节点关系获取元素逻辑性强,但兼原创 2021-07-31 10:14:45 · 187 阅读 · 2 评论 -
JavaScript排他思想、属性操作及案例
JSday7文章目录JSday7操作元素(==排他思想==)==案例1==:表格隔行变色==案例2==:全选和取消全选按钮自定义属性操作获取属性的方式区别设置属性值移除属性==案例3==:tab栏切换(重点)操作元素(排他思想)若有同一组元素,我们想要某一元素实现某种样式,需要用到循环的排他思想所有元素全部清除样式(干掉其他人)给当前元素设置样式(仅留一个)顺序不可颠倒<body> <button>按钮1</button> <but原创 2021-07-29 11:24:48 · 1019 阅读 · 0 评论 -
JavaScript(数据类型存储小节、API、DOM)
JSday6文章目录JSday6JavaScript简单数据类型、复杂数据类型总结简单数据类型与复杂数据类型堆和栈简单类型的内存分配复杂类型的内存分配简单类型传参复杂类型传参Web APIWeb APIs 和 JS基础关联性API 和 Web APIDOM获取元素事件基础执行事件的步骤操作元素改变元素内容节点操作JavaScript简单数据类型、复杂数据类型总结简单数据类型与复杂数据类型简单数据类型值类型:在存储变量中存存储的值是本身,因此又叫值类型。string,number,boolean,原创 2021-07-17 14:10:43 · 131 阅读 · 0 评论