![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JavaScript笔记
文章平均质量分 71
JavaScript基础知识学习笔记
K I S
这个作者很懒,什么都没留下…
展开
-
Javascript实现模态窗口拖动效果
Javascript实现模态窗口拖动效果原创 2022-05-30 18:46:14 · 98 阅读 · 0 评论 -
Javascript实现文字跟随鼠标(延时效果)
Javascript实现文字跟随鼠标效果:代码HTML <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> <li>7</li> <li>8</li> &原创 2022-05-27 11:55:19 · 804 阅读 · 0 评论 -
JavaScript-缓动动画增强
Javascript-缓动滑动动画实现原创 2022-07-13 10:35:51 · 151 阅读 · 0 评论 -
JavaScript-初时JS
(一)初识JS1. JavaScript历史布兰登艾奇(Brendan Eich, 1961年~)。神奇的大哥在1995年利用10天完成JavaScript设计。网景公司最初命名为LiveScript ,后来在与Sun合作之后将其改名为JavaScript.2. JavaScript是什么lavaScript是世界上最流行的语言之一,是一种运行在客户端的脚本语言(Script是脚本的意思)脚本语言:不需要编译,运行过程中由js解释器(js引擎)逐行来进行解释并执行。现在也可以基于Nodejs技原创 2022-05-10 21:41:12 · 88 阅读 · 0 评论 -
JavaScript-变量
(二)变量1. 变量的实质变量是程序在内存中申请的一块用来存放数据的空间。2. 变量的声明声明变量赋值2.1 声明变量// 声明一个叫age的变量var age;let name;const PI = 3.14;var 是一个JS关键字,用来声明变量(variable变量的意思),使用该关键字声明变量后,计算机会自动为变量分配内存空间,不需要程序员管age 是程序员定义的变量名,我们要通过变量名来访问内存中分配的空间3. 变量的初始化var age = 18;初始化原创 2022-05-12 08:57:04 · 51 阅读 · 0 评论 -
JavaScript-事件高级
(三)事件高级1. 注册事件(绑定事件)1.1 注册事件概述给元素添加事件,称为注册事件或者绑定事件。注册事件有两种方式:传统方式 和 事件监听注册方式。1.1.1 传统注册方式利用on 开头的事件onclick<button onclick="alert('hi~')"></button>btn.onclick = function() {};特点:注册事件的 唯一性同一个元素同一个事件只能设置一个处理函数,最后注册的处理函数将会 覆盖 前面注册的处理函数。原创 2022-05-22 21:38:38 · 230 阅读 · 0 评论 -
JavaScript-数据类型
(三)数据类型1. 数据类型概述1.1 为什么需要数据类型在计算机中,不同的数据所需占用的存储空间是不同的,为了便于把数据分成所需内存大小不同的数据,充分利用存储空间,于是定义了不同的数据类型。简单来说,数据类型就是数据的类别型号。比如姓名“张三” ,年龄18,这些数据的类型是不一样的。1.2 变量的数据类型变量是用来存储值的所在处,它们有名字和数据类型。变量的数据类型决定了如何将代表这些值的位存储到计算机的内存中。JavaScript是一种弱类型或者说动态语言。这意味着不用提前声明变量的类型,原创 2022-05-21 16:29:26 · 201 阅读 · 0 评论 -
JavaScript-运算符
(四)JS 运算符运算符( operator )也被称为操作符,是用于实现赋值、比较和执行算数运算等功能的符号。JavaScript常用的运算符有:算术运算符递增和递减运算符比较运算符逻辑运算符赋值运算符1. 算数运算符+-*/%1.1 浮点数的精度问题浮点数值的最高精度是17位小数,但在进行算术计算时其精确度远远不如整数。var result =0.1+0.2; //结果不是0.3,而是: 0.30000000000000004 console.log(0.07原创 2022-05-21 16:31:24 · 70 阅读 · 0 评论 -
JavaScript-流程控制
(五)流程控制顺序结构选择分支结构循环结构1. 顺序结构2. 选择结构if-elseif-else if-elseswitch-case2.1 if-else语法if (condition) statement1[else statement2]2.2 if-else if-else语法if (condition1) statement1else if (condition2) statement2else if (condition3)原创 2022-05-21 16:33:03 · 51 阅读 · 0 评论 -
JavaScript-函数
(六)函数1. 概述函数:就是封装了一段可被重复调用执行的代码块。通过此代码块可以实现大量代码的重复使用。封装:把一个或者多个功能通过函数的方式封装起来,对外只提供一个简单的函数接口。2. 函数的声明与调用// 声明function funcName(params) { // function statements}funcName(params);// 调用3. 形参与实参声明时传入的为形参,调用时传入的为实参。4. 实参个数与形参个数不匹配的情况参数个数说明原创 2022-05-21 16:34:11 · 43 阅读 · 0 评论 -
JavaScript-对象
(十)对象1. 对象1.1 什么是对象?在JavaScript中,对象是一组无序的相关属性和方法的集合,所有的事物都是对象,例如字符串、数值、数组、函数等。对象是由属性和方法组成的。属性:事物的特征,在对象中用属性来表示(常用名词)方法:事物的行为,在对象中用方法来表示(常用动词)1.2 为什么需要对象?2. 创建对象使用字面量创建对象使用 new Object 创建对象利用构造函数创建对象2.1 字面量创建使用 {} 创建,包含属性和方法,采用键值对表示,创建的对象称为对原创 2022-05-21 16:37:22 · 66 阅读 · 0 评论 -
JavaScript-内置对象
(十一)内置对象1. 内置对象Javascript中的对象分为3种:自定义对象、内置对象、浏览器对象前面两种对象是IS基础内容,属于ECMAScript ;第三个浏览器对象属于我们JS独有的,我们JS APl讲解内置对象就是指JS语言自带的一些对象,这些对象供开发者使用,并提供了一些常用的或是最基本而必要的功能(属性和方法)2. 数学对象 Math2.1 Math 的使用查询 MDN 文档const arr = [3,4,11,24,89,2,34]console.log(Math.m原创 2022-05-21 16:39:12 · 74 阅读 · 0 评论 -
JavaScript-数组
(七)数组1. 基本概念JS 数组都是动态创建的,可以自由增加数组长度,这点不同于 C/C++。一个 JS 数组内可以存放不同类型的元素,例如 ['abc', 1, true, undefined],这点也不同于 C/C++/Java。2. 创建数组2.1 数组字面量创建数组创建空数组let arr = [];创建一般数组let arr = [1, 2, 3];2.2 new Array 创建数组对象创建空数组let arr = new Array();创建指原创 2022-05-21 16:35:03 · 123 阅读 · 0 评论 -
JavaScript-作用域
(八)作用域1. 作用域概述通常来说,一段程序代码中所用到的名字并不总是有效和可用的,而限定这个名字的可用性的代码范围就是这个名字的作用域。作用域的使用提高 程序逻辑的局部性,增强了程序的可靠性,减少了名字冲突。2. 全局变量在全局作用域下声明的变量叫做全局变量(在函数外部定义的变量)。全局变量在代码的任何位置都可以使用在全局作用域下var声明的变量是全局变量。特殊情况下,在函数内不使用var声明的变量也是全局变量(不建议使用)3. 局部变量在局部作用域下声明的变量叫做局部变量(在函数原创 2022-05-21 16:35:48 · 51 阅读 · 0 评论 -
JavaScript-复杂类型
(十二) 复杂类型1. 简单类型与复杂类型简单类型又叫做基本数据类型或者值类型,复杂类型又叫做引用类型。值类型:简单数据/基本数据类型,在存储时变量中存的是值本身,因此叫做值类型。例如 string, number, boolean, undefined, null引用类型:复杂数据类型,在存储时变量中存储的仅仅是地址(引用),因此叫做引用数据类型。通过 new 关键字创建的对象(系统对象、自定义对象),如 Object、Date 等。2. 堆和栈堆栈空间分配区别︰栈(操作系统):由操原创 2022-05-21 16:40:09 · 135 阅读 · 0 评论 -
JavaScript-声明提升
(九) 声明提升我们js引擎运行js分为两步: 预解析,代码执行预解析js引擎会把js里面所有的var 还有function提升到当前作用域的最前面代码执行 按照代码书写的顺序从上往下执行预解析分为变量预解析(变量提升) 和函数预解析(函数提升)变量提升就是把所有的变量声明提升到当前的作用域最前面 不提升赋值操作函数提升就是把所有的函数声明提升到当前的作用域最前面,不调用操作举例一func();var func = function () { console.log原创 2022-05-21 16:36:40 · 131 阅读 · 0 评论 -
JavaScript-异常处理
(十三)异常处理1. try/catch/finallytry/catch/finally 是 JavaScript 异常处理语句。try { //调试代码块} catch(e) { //捕获异常,并进行异常处理的代码块} finally{ //后期清理代码块}在正常情况下,JavaScript 按顺序执行 try 子句中的代码,如果没有异常发生,将会忽略 catch 子句,跳转到 finally 子句中继续执行。如果在 try 子句运行时发生错误,或者使用 thr原创 2022-05-22 21:33:48 · 894 阅读 · 0 评论 -
JavaScript-Web Api 简介
(一)Web Api 简介1. Web APIs 和 JS 基础关联性1.1 JS 组成ECMAScript: JS 语法BOM: Web APIDOM: Web API2. API 和 Web API2.1 APIAPI:Application Programming Interface,应用程序接口。2.2 Web APIWeb API 是浏览器提供得一套操作浏览器功能和页面元素得 API(BOM 和 DOM)。...原创 2022-05-22 21:35:55 · 235 阅读 · 0 评论 -
JavaScript-DOM 基础
(二)DOM 基础1. DOM 简介1.1 什么是 DOM文档对象模型(Document Object Model,简称DOM ),是W3C组织推荐的处理可扩展标记语言(HTML或者XML)的标准编程接口。W3C已经定义了一系列的DOM接口,通过这些DOM接口可以改变网页的内容、结构和样式。1.2 DOM 树文档:一个页面就是一个文档,DOM中使用document表示元素:页面中的所有标签都是元素,DOM中使用element表示节点:网页中的所有内容都是节点(标签、属性、文本、注释等),D原创 2022-05-22 21:37:18 · 195 阅读 · 0 评论 -
JavaScript-BOM 基础
(四)BOM 基础1. BOM 概述1.1 BOM 概述BOM(Browser Object Model)即浏览器对象模型,它提供了独立于内容而与浏览器窗口进行交互的对象,其核心对象是 window。BOM 由一系列相关的对象构成,并且每个对象都提供了很多方法与属性。BOM 缺乏标准,JavaScript 语法的标准化组织是ECMA,DOM 的标准化组织是 W3C,BOM 最初是Netscape 浏览器标准的一部分1.2 DOM vs BOMDOMBOM文档对象模型浏览器原创 2022-05-22 21:40:27 · 122 阅读 · 0 评论 -
JavaScript-本地存储
(七)本地存储1. 本地存储概述1.1 背景随着互联网的快速发展,基于网页的应用越来越普遍,同时也变的越来越复杂,为了满足各种各样的需求,会经常性在本地存储大量的数据,HTML5 规范提出了相关解决方案。1.2 本地存储特性数据存储在用户浏览器中设置、读取方便、甚至页面刷新不丢失数据容量较大,sessionStorage 约5M、localStorage 约20M只能存储字符串,可以将对象 JSON.stringify() 编码后存储2. window.sessionStorage原创 2022-05-22 21:44:59 · 57 阅读 · 0 评论 -
JavaScript-PC端网页特效
(五)PC端网页特效[!TIP]在前面学习了JS基础、DOM 和 BOM 的基本操作后,这部分主要学习这些知识的拓展应用。1. 元素偏移量 offset 系列1.1 offset 概述offset 翻译过来就是偏移量,我们使用 offset 系列相关属性可以动态的得到该元素的位置(偏移)、大小等。获得元素距离带有定位父元素的位置获得元素自身的大小(宽度高度)注意:返回的数值都不带单位offset 系列常用属性:[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(原创 2022-05-22 21:42:21 · 261 阅读 · 0 评论