JavaScript
关注
分享
扫一扫
文章平均质量分 82
JavaScript
若年封尘
这个作者很懒，什么都没留下…
展开
-
2023前端大厂高频面试题之JavaScript篇(5)
typescript和javascript有什么区别模板字符串扩展运算符Object.assign基于发布订阅模式的js事件处理中心EventEmitter类中的constructorjs不引入第三个变量的情况下交换a、b的值console.log输出空值合并操作符(??)及可选链式操作符(?.)ES6 中常见的语法特性原创 2023-11-20 15:43:16 · 448 阅读 · 2 评论 -
2023前端大厂面试题之JavaScript篇(4)
严格模式use strictJavaScript this 关键字call、apply和bindmap 和 weakMap 的区别js 延迟加载的方式js的模块化规范JavaScript多态JavaScript中常见设计模式冒泡和捕获JS 单线程的好处路由懒加载js 垃圾回收机制js释放变量内存哪些操作会造成内存泄漏原创 2023-04-06 13:40:49 · 454 阅读 · 0 评论 -
学习jQuery这一篇就够了
jQuery是对原生JavaScript的封装，是一个轻量级的"写的少，做的多"的 JavaScript 库。封装了JavaScript常用的功能代码，优化了DOM操作、事件处理、动画设计和Ajax交互。它的出现加快了前端人员的开发速度，我们可以很方便的调用和使用它，从而提高开发效率。原创 2022-10-23 22:46:05 · 1164 阅读 · 1 评论 -
万字长文详解ES6，学ES6这一篇就够了
上面代码中，source对象的foo属性的值是一个赋值函数，Object.assign方法将这个属性拷贝给target1对象，结果该属性的值变成了undefined。而箭头函数没有自己的this对象，this始终指向定义时上层作用域中的this，由于箭头函数没有自己的this，所以当然也就不能用call()、apply()、bind()这些方法去改变this的指向。对象的解构赋值用于从一个对象取值，相当于将目标对象自身的所有可遍历的、但尚未被读取的属性，分配到指定的对象上面。原创 2022-10-17 19:06:32 · 1941 阅读 · 0 评论 -
移动端基础知识
当我们手指离开屏幕的时候，就没有了 touches 和 targetTouches 列表，但是会有 changedTouches。2.封装touch事件：当我们手指触摸屏幕，记录当前触摸时间;当我们手指离开屏幕， 用离开的时间减去触摸的时间;TouchEvent 是一类描述手指在触摸平面的状态变化的事件。这类事件用于描述一个或多个触点，使开发者可以检测触点的移动，触点的增加和减少……：正在触摸当前DOM元素的手指列表，如果侦听的是一个DOM元素，他们两个是一样的；：正在触摸屏幕的所有手指的列表；原创 2022-09-11 15:22:07 · 320 阅读 · 1 评论 -
JavaScript-BOM基础巩固
元素偏移量offsetofferTop和offerLeft以带有定位的父亲为准，如果没有父亲或者父亲没有定位则以body为准；宽度和高度是包含padding、boder和width的。原创 2022-09-11 15:17:04 · 203 阅读 · 1 评论 -
2023前端大厂面试题之JavaScript篇(3)
系列文章：2022前端大厂面试题之JavaScript篇(1)2022前端大厂面试题之JavaScript篇(2)文章目录0.1 + 0.2 !== 0.3Javascript 异步加载Javascript 异步加载的方式Ajax、Axios、Fetch的区别什么是事件委托？创建一个对象的方式有哪几种？数组的常用方法Math的常用方法JS实现继承的几种方式JavaScript中的Map 和 SetWebSocket网站性能优化前端工程化JavaScript的装箱和拆箱语法糖（Syntactic s.原创 2022-04-18 23:37:43 · 3347 阅读 · 3 评论 -
2023前端大厂面试题之JavaScript篇(1)
js中的同步和异步异步编程的实现方式回调地狱JavaScript this 关键字JavaScript中基本数据类型和引用数据类型的区别原型原型链原型链面试题原型继承防抖和节流宏任务与微任务宏任务与微任务面试题......原创 2022-03-05 21:17:18 · 6067 阅读 · 3 评论 -
2023前端大厂面试题之JavaScript篇(2)
JavaScript数据类型null和undefined的异同点？undefined做标识符如何获取安全的 undefined 值[] == ![] 为什么是 trueconst 定义的值一定是不能改变的吗?JavaScript判断数据类型的方法typeoftypeof null 为什么返回的是 'object'instanceof如何实现一个 instanceof ?判断数组的方式有哪些NaN是什么？有什么特点？0.1 + 0.2 !== 0.3let、const、var原创 2022-03-08 16:21:15 · 2234 阅读 · 2 评论 -
JavaScript实用案例
发布留言案例<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <textarea name=原创 2021-08-13 14:34:37 · 235 阅读 · 0 评论 -
一文搞定JavaScript-BOM，前端小白必知必会
BOM简介BOM比DOM更大，它包含DOM。window对象的常见事件窗口加载事件1.load要等页面内容全部加载完毕，包含页面dom元素、图片、flash、css等。2.DOMContentLoaded要等DOM加载完毕即可，不包含图片、flash、css等就可以执行，加载速度比load快一些。调整窗口大小事件...原创 2021-08-10 12:49:25 · 439 阅读 · 2 评论 -
JavaScript事件高级，前端小白必知必会
注册事件(绑定事件)原创 2021-08-07 14:54:46 · 331 阅读 · 2 评论 -
JavaScript基础语法-DOM，前端小白必知必会
DOM树：获取元素有以下几种方式获取元素，返回的是一个元素对象。var eleSelect = document.getElementById('selRate');var lis = document.getElementsByTagName('li');var nav = document.getElementsByClassName('nav');//H5新增获取元素方式//返回指定选择器的第一个元素对象//H5新增获取元素方式var nav = document.queryS原创 2021-08-03 22:33:47 · 910 阅读 · 3 评论 -
JavaScript预解析
JavaScript预解析JavaScript作为解释型语言在运行时是自上往下一句一句地解析吗？其实并不是，在js中存在预解析这一机制。1.JavaScript 引擎运行 JavaScript 代码，分为两步：预解析和代码执行。预解析：js引擎会把js中所有的var和function提升到当前作用域的最前面；代码执行：按照代码的书写顺序从上到下依次执行。（必须完成上一步后才会执行代码）2.预解析分为变量预解析（变量提升）和代码预解析（代码提升）。变量提升：把变量的声明提升到当前作用域的最原创 2021-07-11 23:43:35 · 173 阅读 · 1 评论 -
70个JavaScript面试问题
70个JavaScript面试问题1.undefined 和 null 有什么区别？在理解undefined和null之间的差异之前，我们先来看看它们的相似类。它们属于 JavaScript 的 7 种基本类型。let primitiveTypes = [‘string’,‘number’,‘null’,‘undefined’,‘boolean’,‘symbol’, ‘bigint’];...转载 2020-01-16 19:17:03 · 622 阅读 · 0 评论 -
用一个浏览器实现n倍速播放本地视频
用浏览器倍速播放本地视频(.flv,.mp4……)，再也不用下载播放器了！当我们想要学习一些技术时，可能需要下载教学视频到本地，但有些视频的格式电脑自带的播放器并不支持播放（就比如.flv格式的视频）或者是嫌视频语速太慢。 这个时候可能就需要自己从网上下载一些可以播放不常见格式视频的可以倍速播放的播放器，但往往搜索半天也找不到自己中意的一款播放器，令人头秃！笔者用html5中的video标签...原创 2019-12-19 17:46:30 · 9009 阅读 · 11 评论 -
js实现阅读全部协议后（滚动条拉到底）才允许注册
效果截图：代码实现：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> .div{ margin:0 auto; width...原创 2019-12-10 13:23:32 · 1869 阅读 · 2 评论 -
js实现点击下拉列表文本框中出现对应的网址，点击跳转按钮实现跳转
程序要求：编写一个html文件的网页代码，页面包含一个下拉列表框、一个文本框和一个按钮，下拉列表框选择要去的网站，当选择完毕后文本框中出现对应的网址。点击确认跳转按钮后访问文本框中出现的网址。实现效果：实现代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">...原创 2019-11-23 17:56:25 · 3703 阅读 · 0 评论 -
JavaScript求两个日期相差的天数
实现效果：实现代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body></body><script type...原创 2019-11-23 17:17:36 · 1340 阅读 · 0 评论 -
JavaScript计算正方形面积
用JavaScript实现计算正方形的面积注意用一个Math.pow()函数。实现效果：实现代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head>&l...原创 2019-11-23 15:33:58 · 3813 阅读 · 0 评论 -
js中value、innerHTML、innerText的区别
valuevalue是表单元素特有的属性，输入输出的是转义文本(字符串)。可以用来修改（获取）textarea和input的value等表单属性的值或元素的内容。innerHTMLinnerHTML用来修改（获取）HTML元素（如div）html格式的内容。innerHtml是div标签内的文本，输入输出到该DOM内部纯HTML代码（获得td、div等html元素时，他们没有val...原创 2019-11-23 15:22:48 · 1255 阅读 · 0 评论 -
真正有效解决setInterval()越来越快的问题
点击开始按钮，参数变为真，计时器才会改变，有效避免了反复调用setInterval函数，从而有效避免了setInterval()引发的加速效果。效果截图：实现代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>简易计时器</ti...原创 2019-11-17 02:02:15 · 10103 阅读 · 1 评论 -
js获取交易表单下拉框选中的值
实验任务：1、网页标题：我的交易表单2、在页面上创建一个表单用户界面，供用户挑选配置一台计算机。例如：CPU、内存、硬盘、主板、显卡、机箱、光驱等。不同型号的产品价格不同，当用户改变所选配件的同时，计价程序自动计算新的价格，并且通过告警对话框或文本框来通知用户目前所选择的计算机配件的总价。（1）采用内嵌式引入JavaScript（2）计算机各配件的型号用下拉列表方式供用户选择，每个标签的v...原创 2019-11-16 22:54:41 · 2048 阅读 · 0 评论 -
js中键盘控制上下左右
JavaScript中用键盘实现控制小人上下左右移动：浏览器实现效果：代码实现：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>键盘控制特效</title> <style type="text/css"> ...原创 2019-11-05 15:59:30 · 1692 阅读 · 0 评论 -
浅谈js键盘事件全面控制
第一部分：浏览器的按键事件第二部分：兼容浏览器第三部分：代码实现和优化第四部分：总结第一部分：浏览器的按键事件用js实现键盘记录，要关注浏览器的三种按键事件类型，即keydown，keypress和keyup，它们分别对应onkeydown、 onkeypress和onkeyup这三个事件句柄。一个典型的按键会产生所有这三种事件，依次是keydown，keypress，然后是按键释放时候...转载 2019-11-05 15:35:00 · 373 阅读 · 0 评论 -
JavaScript实现shy哥"血条消失术"
相比喜欢英雄联盟的玩家都看了最近IG对阵TL的一场比赛，the shy用吸血鬼（哦不，是抽血泵）上演的“血条消失术”。那么怎么用JavaScript实现这种效果呢？浏览器实现效果：主要利用setInterval函数，每个一段时间让进度条的宽度缩短，下面是实现代码：实现代码：<!DOCTYPE html><html lang="en"><head&g...原创 2019-11-03 15:41:51 · 2379 阅读 · 1 评论 -
js按钮实现切换图片效果
通过JavaScript设置按钮功能实现点击按钮切换上一张、下一张图片。（具体实现代码在图片后面）。浏览器实现效果：实现代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>图片切换</title> <styl...原创 2019-11-01 23:07:06 · 7607 阅读 · 0 评论 -
详解clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop
clientHeight：内容可视区域的高度，也就是说页面浏览器中可以看到内容的这个区域的高度。包括padding但不包括border、水平滚动条、margin的元素的高度。scrollHeight:滚动大小，指的是包含滚动内容的元素大小（元素内容的总高度）。IE、Opera 认为 scrollHeight 是网页内容实际高度，可以小于 clientHeight。NS、FF 认为 scr...原创 2019-10-27 23:25:08 · 1036 阅读 · 2 评论 -
JS实现倒计时页面跳转效果
通过js的setInterval方法实现倒计时页面跳转效果：浏览器实现效果：实现代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>倒计时页面跳转</title></head><body> &...原创 2019-10-27 18:31:26 · 1114 阅读 · 1 评论 -
js加载事件（onload）
onload 事件会在页面或图像加载完成后立即发生，同时执行被调用的程序。onload 通常用于 <body> 元素，在页面完全载入后(包括图片、css文件等等。)执行脚本代码。使用方法：在 HTML 中:<body οnlοad="fun()"></body>在 JavaScript 中:window.οnlοad=function(){Some...原创 2019-10-27 16:03:13 · 6720 阅读 · 1 评论 -
js创建一个显示当前时间的简易小时钟
通过JavaScript的setInterval函数创建一个可以显示当前时间的简易小时钟：（这里只给出了一个最基本的样式，可以添加更多样式美化它！）浏览器显示结果：代码实现：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>clock&l...原创 2019-10-24 11:15:35 · 588 阅读 · 0 评论 -
js创建一个简单的时钟
想要用js创建一个小时钟，首先必须要了解js的Timing 事件：JavaScript 可以在时间间隔内执行，这就是所谓的定时事件。一、setTimeout()方法表示在等待指定的毫秒数后执行函数。（可制作延迟效果）语法：window.setTimeout(function, milliseconds);第一个参数是要执行的函数，第二个参数指示执行之前的毫秒数。clearTimeout(...原创 2019-10-15 15:11:10 · 1705 阅读 · 0 评论 -
js实现浏览器中的前进、后退按钮
JavaScript中window.history 对象包含浏览器历史，history.back()等同于在浏览器点击后退按钮，history.forward() 等同于在浏览器中点击前进按钮。history.back() 方法加载历史列表中前一个 URL，相当于在浏览器中点击后退按钮。在页面中创建后退按钮：<html><head><script>...原创 2019-10-15 14:26:12 · 12044 阅读 · 4 评论 -
JavaScript Window对象
JavaScript Window 对象Window 对象表示浏览器中打开的窗口。Window 对象描述Window 对象表示一个浏览器窗口或一个框架。在客户端 JavaScript 中，Window 对象是全局对象，所有的表达式都在当前的环境中计算。...转载 2019-10-12 17:11:40 · 327 阅读 · 0 评论 -
JavaScript字符串
JavaScript的字符串就是用’ '或" "括起来的字符表示。1.如果字符串内部既包含 ’ 又包含 " 怎么办？可以用转义字符 \ 来标识，比如：‘I’m “OK”!’;表示的字符串内容是：I’m “OK”!2.ASCII字符可以以\x##形式的十六进制表示，例如： <script> document.write('\x41');// 完全等同于 'A' </s...原创 2019-09-24 16:27:26 · 481 阅读 · 0 评论 -
JavaScript核心基础ECMAScript
JavaScript 字面量在编程语言中，一般固定值称为字面量，有字符串字面量、表达式字面量 、数组字面量、对象字面量、函数字面量。JavaScript 变量在编程语言中，变量用于存储数据值。JavaScript 使用关键字 var 来定义变量， 使用等号来为变量赋值。JavaScript 中，对大小写敏感，常见的是驼峰法的命名规则，如 lastName (而不是lastnam...原创 2019-09-24 22:21:46 · 645 阅读 · 1 评论 -
JavaScript条件运算符示例
条件运算符语法：variablename=(condition)?value1:value2代码示例：<input type="text" id="age"></input><p id="demo"></p><script>function myFunction(){ var age,voteable; age=do...原创 2019-09-28 20:22:27 · 298 阅读 · 0 评论 -
常见的 HTML 事件
HTML 事件是发生在 HTML 元素上的“事情”，是浏览器或用户做的某些事情。当在 HTML 页面中使用 JavaScript 时，JavaScript 能够“应对”这些事件。事件句柄：onabort 图像的加载被中断。onblur 元素失去焦点。onchange 域的内容被改变。onclick 当用户点击某个对象时调用的事件句柄。ondblclick 当用户双击某个对象时调用的事件...原创 2019-09-30 11:06:42 · 505 阅读 · 0 评论 -
JavaScript异常：输入验证案例
通过try catch检查输入是否符合要求。如果值是错误的，将抛出异常（err）。代码示例：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>检测输入</title></head><body> &...原创 2019-10-03 22:02:08 · 280 阅读 · 0 评论 -
w3cschool编程实战之JavaScript 队列
JavaScript 队列题目：在计算机科学中 队列（queue）是一个抽象的数据结构，队列中的数据条目都是有秩序的。新的条目会被加到 队列 的末尾，旧的条目会从 队列 的头部被移出。写一个函数 queue ，用一个数组arr和一个数字item作为参数。数字item添加到数组的结尾，然后移出数组的第一个元素，最后队列函数应该返回被删除的元素。queue([], 1) 应该返回 1queu...原创 2019-10-05 14:52:33 · 700 阅读 · 0 评论