09 2020 档案

mouseenter 和mouseover的区别
摘要：当鼠标移动到元素上时就会触发mouseenter 事件 类似 mouseover，它们两者之间的差别是 mouseover 鼠标经过自身盒子会触发，经过子盒子还会触发。mouseenter 只会经过自身盒子触发 之所以这样，就是因为mouseenter不会冒泡 跟mouseenter搭配鼠标离开 m 阅读全文
posted @ 2020-09-29 11:52 星辰ꦿ.大海 阅读(186) 评论(0) 推荐(0)
元素滚动 scroll 系列
摘要：1. scroll 概述 scroll 翻译过来就是滚动的，我们使用 scroll 系列的相关属性可以动态的得到该元素的大小、滚动距离等。 2. 页面被卷去的头部 如果浏览器的高（或宽）度不足以显示整个页面时，会自动出现滚动条。当滚动条向下滚动时，页面上面被隐藏掉的高度，我们就称为页面被卷去的头部。 阅读全文
posted @ 2020-09-29 11:47 星辰ꦿ.大海 阅读(363) 评论(0) 推荐(0)
元素可视区 client 系列
摘要：1. client概述 client 翻译过来就是客户端，我们使用 client 系列的相关属性来获取元素可视区的相关信息。通过 client 系列的相关属性可以动态的得到该元素的边框大小、元素大小等。 2. 淘宝 flexible.js 源码分析 立即执行函数 (function(){})() 或 阅读全文
posted @ 2020-09-29 11:44 星辰ꦿ.大海 阅读(151) 评论(0) 推荐(0)
元素偏移量 offset 系列
摘要：1. offset 概述 offset 翻译过来就是偏移量， 我们使用 offset系列相关属性可以动态的得到该元素的位置（偏移）、大小等。 获得元素距离带有定位父元素的位置，如果父级元素都没有定位，则以body位置为准 获得元素自身的大小（宽度高度） 注意：返回的数值都不带单位 2. offset 阅读全文
posted @ 2020-09-29 11:43 星辰ꦿ.大海 阅读(471) 评论(0) 推荐(0)
JS执行机制
摘要：以下代码执行的结果是什么？ console.log(1); setTimeout(function () { console.log(3); }, 1000); console.log(2);//结果为 1 2 3 以下代码执行的结果是什么？ console.log(1); setTimeout(f 阅读全文
posted @ 2020-09-26 18:06 星辰ꦿ.大海 阅读(129) 评论(0) 推荐(0)
BOM
摘要：1. 什么是BOM BOM（Browser Object Model）即浏览器对象模型，它提供了独立于内容而与浏览器窗口进行交互的对象，其核心对象是 window。 BOM 由一系列相关的对象构成，并且每个对象都提供了很多方法与属性。 BOM 缺乏标准，JavaScript 语法的标准化组织是 EC 阅读全文
posted @ 2020-09-26 17:58 星辰ꦿ.大海 阅读(181) 评论(0) 推荐(0)
常用键盘事件
摘要：1. 键盘事件 <script> // 常用的键盘事件 //1. keyup 按键弹起的时候触发 document.addEventListener('keyup', function() { console.log('我弹起了'); })​ //3. keypress 按键按下的时候触发 不能识别 阅读全文
posted @ 2020-09-23 15:31 星辰ꦿ.大海 阅读(497) 评论(0) 推荐(0)
常用鼠标事件
摘要：常用鼠标事件 1 、案例：禁止选中文字和禁止右键菜单 <body> 我是一段不愿意分享的文字 <script> // 1. contextmenu 我们可以禁用右键菜单 document.addEventListener('contextmenu', function(e) { // prevent 阅读全文
posted @ 2020-09-21 23:35 星辰ꦿ.大海 阅读(231) 评论(0) 推荐(0)
事件高级
摘要：1、注册事件（2种方式） 2、事件监听 addEventListener()事件监听（IE9以后支持） eventTarget.addEventListener()方法将指定的监听器注册到 eventTarget（目标对象）上，当该对象触发指定的事件时，就会执行事件处理函数。 该方法接收三个参数: 阅读全文
posted @ 2020-09-21 23:29 星辰ꦿ.大海 阅读(222) 评论(0) 推荐(0)
DOM的核心总结
摘要：1、创建元素的三种方式 document.write () element.innerHTML document.createElement () 区别 document.write直接将内容写入页面的内容流，但是文档流执行完毕，则它会导致页面全部重绘 innerHTML 是将内容写入某个DOM节点 阅读全文
posted @ 2020-09-21 16:41 星辰ꦿ.大海 阅读(254) 评论(0) 推荐(0)
节点操作
摘要：1.1. 节点概述 为什么学节点操作 网页中的所有内容都是节点（标签、属性、文本、注释等），在DOM 中，节点使用 node 来表示。 HTML DOM 树中的所有节点均可通过 JavaScript 进行访问，所有 HTML 元素（节点）均可被修改，也可以创建或删除。 一般地，节点至少拥有nodeT 阅读全文
posted @ 2020-09-21 15:17 星辰ꦿ.大海 阅读(242) 评论(0) 推荐(0)
自定义属性操作
摘要：1.1 获取属性值 <div id="demo" index="1" class="nav"></div> <script> var div = document.querySelector('div'); // 1. 获取元素的属性值 // (1) element.属性 console.log(d 阅读全文
posted @ 2020-09-21 15:04 星辰ꦿ.大海 阅读(278) 评论(0) 推荐(0)
排他思想及部分案例
摘要：1.1 排他思想 如果有同一组元素，我们想要某一个元素实现某种样式， 需要用到循环的排他思想算法： 所有元素全部清除样式（干掉其他人） 给当前元素设置样式 （留下我自己） 注意顺序不能颠倒，首先干掉其他人，再设置自己 <button>按钮1</button> <button>按钮2</button> 阅读全文
posted @ 2020-09-21 14:56 星辰ꦿ.大海 阅读(499) 评论(0) 推荐(1)
事件基础及操作元素
摘要：1.事件基础 1.1. 事件概述 JavaScript 使我们有能力创建动态页面，而事件是可以被 JavaScript 侦测到的行为。 简单理解： 触发 响应机制。 网页中的每个元素都可以产生某些可以触发 JavaScript 的事件，例如，我们可以在用户点击某按钮时产生一个 事件，然后去执行某些操 阅读全文
posted @ 2020-09-18 19:44 星辰ꦿ.大海 阅读(408) 评论(0) 推荐(0)
获取元素
摘要：为什么要获取页面元素？ 例如：我们想要操作页面上的某部分(显示/隐藏，动画)，需要先获取到该部分对应的元素，再对其进行操作。 1. 根据ID获取 语法：document.getElementById(id)作用：根据ID获取元素对象参数：id值，区分大小写的字符串返回值：元素对象 或 null 案例 阅读全文
posted @ 2020-09-18 19:33 星辰ꦿ.大海 阅读(271) 评论(0) 推荐(0)
DOM 介绍
摘要：1. 什么是DOM 文档对象模型（Document Object Model，简称DOM），是 W3C 组织推荐的处理可扩展标记语言（html或者xhtml）的标准编程接口。 W3C 已经定义了一系列的 DOM 接口，通过这些 DOM 接口可以改变网页的内容、结构和样式。 DOM是W3C组织制定的一 阅读全文
posted @ 2020-09-18 19:28 星辰ꦿ.大海 阅读(389) 评论(0) 推荐(0)
Web APIs 和JS基础关联性
摘要：1、JS组成 2、 JS基础阶段以及Web APIs阶段 JS基础阶段 我们学习的是 ECMAScript标准规定的基本语法 要求掌握 JS基础语法 只学习基本语法 ,做不了常用的网页交互效果 目的是为了 JS后面的课程打基础、 做铺垫 Web APIs阶段 Web APIs是W3C组织的标准 We 阅读全文
posted @ 2020-09-18 19:21 星辰ꦿ.大海 阅读(155) 评论(0) 推荐(0)
swiper插件使用
摘要：swiper插件 官网地址: htps://www. swiper.com.cn/ 下载需要的css和js文件 官网找到类似案例，复制html结构，css样式js 语法 根据需求定制修改模块 阅读全文
posted @ 2020-09-15 22:48 星辰ꦿ.大海 阅读(145) 评论(0) 推荐(0)
简单数据类型和复杂数据类型
摘要：1 简单数据类型 简单类型（基本数据类型、值类型）：在存储时变量中存储的是值本身，因此叫做值类型，包括string ，number，boolean，undefined，null //简单数据类型null 返回的是一 个空的对象 objectvar timer = null ;console.log( 阅读全文
posted @ 2020-09-15 22:45 星辰ꦿ.大海 阅读(1335) 评论(0) 推荐(0)
内置对象
摘要：内置对象 1.1 内置对象 JavaScript 中的对象分为3种：自定义对象 、内置对象、 浏览器对象 前面两种对象是JS 基础 内容，属于 ECMAScript； 第三个浏览器对象属于 JS 独有的， JS API 讲解 内置对象就是指 JS 语言自带的一些对象，这些对象供开发者使用，并提供了一 阅读全文
posted @ 2020-09-15 22:42 星辰ꦿ.大海 阅读(244) 评论(0) 推荐(0)
对象
摘要：1 对象的相关概念 什么是对象？ 现实生活中:万物皆对象,对象是一个具体的事物,看得见摸得着的实物。例如,一本书、一辆汽车、一个人 可以是“对象”, 一个数据库、一张网页、一个与远程服务器的连接也可以是“对象"。 在 JavaScript 中，对象是一组无序的相关属性和方法的集合，所有的事物都是对象 阅读全文
posted @ 2020-09-07 23:18 星辰ꦿ.大海 阅读(617) 评论(0) 推荐(0)
预解析
摘要：1.预解析的相关概念 JavaScript 代码是由浏览器中的 JavaScript 解析器来执行的。JavaScript 解析器在运行 JavaScript 代码的时候分为两步：预解析和代码执行。 预解析：在当前作用域下, JS 代码执行之前，浏览器会默认把带有 var 和 function 声明 阅读全文
posted @ 2020-09-07 23:13 星辰ꦿ.大海 阅读(279) 评论(0) 推荐(0)
作用域
摘要：1.1 作用域概述 通常来说，一段程序代码中所用到的名字（变量名）并不总是有效和可用的，而限定这个名字的可用性的代码范围就是这个名字的作用域。作用域的使用提高了程序逻辑的局部性，增强了程序的可靠性，减少了名字冲突。 JavaScript（es6前）中的作用域有两种： 全局作用域 局部作用域（函数作用 阅读全文
posted @ 2020-09-06 23:25 星辰ꦿ.大海 阅读(160) 评论(0) 推荐(0)
函数
摘要：1.1 函数的概念 在 JS 里面，可能会定义非常多的相同代码或者功能相似的代码，这些代码可能需要大量重复使用。 虽然 for循环语句也能实现一些简单的重复操作，但是比较具有局限性，此时我们就可以使用 JS 中的函数。 函数：就是封装了一段可被重复调用执行的代码块。通过此代码块可以实现大量代码的重复 阅读全文
posted @ 2020-09-06 22:23 星辰ꦿ.大海 阅读(173) 评论(0) 推荐(0)
数组
摘要：1.1 数组的概念 数组可以把一组相关的数据一起存放，并提供方便的访问(获取）方式。 数组是指一组数据的集合，其中的每个数据被称作元素，在数组中可以存放任意类型的元素。数组是一种将一组数据存储在单个变量名下的优雅方式。 1.2 创建数组 JS 中创建数组有两种方式： 利用 new 创建数组 var 阅读全文
posted @ 2020-09-06 13:47 星辰ꦿ.大海 阅读(252) 评论(0) 推荐(0)
循环和代码规范
摘要：1 - 循环 1.1 for循环 语法结构 for(初始化变量; 条件表达式; 操作表达式 ){ //循环体} 名称作用 初始化变量 通常被用于初始化一个计数器，该表达式可以使用 var 关键字声明新的变量，这个变量帮我们来记录次数。 条件表达式 用于确定每一次循环是否能被执行。如果结果是 true 阅读全文
posted @ 2020-09-03 22:15 星辰ꦿ.大海 阅读(492) 评论(0) 推荐(0)