- 博客(48)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 移动端根据屏幕自适应——postcss-px-to-viewport
postcss-px-to-viewport是一个插件，用起来非常方便，安装一下插件，搞个配置文件就可以直接用了。它的作用是根据配置将css样式中的px转为vw，从而让页面自适应当前屏幕大小。1、安装依赖。2、在目录下新建一个配置文件。根据需要复制以下配置，然后根据需要修改。注意1、不要在模板上写px相关的样式，可能会不生效。（建议把样式都写在中）2、不要在js上写有关px相关的样式，例如点击触发改变宽度等，因为不会直接将px变成vw。(建议直接自己计算出大小，将js中的px手动改为vw，vh或者百
2022-07-02 16:19:29
2291
原创 毕业差不多一年，跳槽华为od岗，已入职
先说一下2022年上半年od岗的面试流程。简历筛选（全日制本科以上）- 机试 - 性格面试 - 技术一面 - 技术二面 - hr面 - 主管面。博主当时面试到入职用了两个多月。都是线上面试，可以约晚上或者周末。机试三道算法题，大概就是力扣简单-中等-困难的三种类型的题目各一道。第一题100分，第二题100分，第三题200分。然后按照通过率乘分数就是最后的得分了。多少分通过看部门，最低要150（目标院校或者部门很缺人），240分以上是稳的。据说od的机考通过率20%左右，大部分人死在这里，而且挂了之后需要
2022-05-23 01:06:54
23096
23
原创 机试算法题-两个栈实现队列
题目：用两个栈实现一个队列。队列的声明如下，请实现它的两个函数 appendTail 和 deleteHead ，分别完成在队列尾部插入整数和在队列头部删除整数的功能。(若队列中没有元素，deleteHead 操作返回 -1 )思路：我们用数组的push(),pop()方法模拟入栈和出栈。1、定义两个栈，调用appendTail直接从栈1入栈就行。2、出栈的时候先判断栈2是否有元素，如果有就先pop出去。3、如果栈2没有元素，把栈1的全部元素都pop到栈2，再从栈2pop一个出去。4、如果栈1
2022-03-24 02:36:00
620
原创 机试算法题-敲击计数器
题目：设计一个敲击计数器，使它可以统计在过去 5 分钟内被敲击次数。（即过去 300 秒）您的系统应该接受一个时间戳参数 timestamp (单位为 秒 )，并且您可以假定对系统的调用是按时间顺序进行的(即 timestamp 是单调递增的)。几次撞击可能同时发生。实现 HitCounter 类:HitCounter() 初始化命中计数器系统。void hit(int timestamp) 记录在 timestamp ( 单位为秒 )发生的一次命中。在同一个 timestamp 中可能会出现几个
2022-03-23 18:06:51
515
原创 机试算法题-求三个矩形相交面积
题目：在坐标中，给定三个矩形，求三个矩形相交面积，如果没有返回-1。（代码最后写了个最后输出三个矩形相交形成的矩形）思路：在三个矩形判断其中随意两个矩形是否交，其中两个矩形没有相交，那么肯定没有三个矩形共同的交集。如果其中两个矩形相交了，那么可以让两个矩形形成的新矩形跟第三个矩形进行判断有没有相交。如果两个矩形相交形成的新矩形跟第三个矩形有交集。那形成的矩形就是三个矩形的交集。代码： <script> let recA={x:1,y:6,w:4,h:4} let rec
2022-03-04 10:33:19
4636
原创 机试算法题-打印机队列
题目：某个打印机根据打印队列执行打印任务。打印任务分为九个优先级，分别采用数字1~9表示，数字越大优先级越高。打印机每次从队列头部取出第一个任务A，然后检查队列余下任务中有没有比A优先级更高的任务，如果有比A优先级高的任务，则将任务A放到队列尾部，否则执行任务A的打印。请编写一个程序，根据输入的打印队列，输出实际打印顺序。输出描述：1、输入：’8，9，10‘输出：’2，1，0‘2、输入：’5，7，6，4‘输出：‘1，2，0，3’3、输入：‘8，7，8，6’输出：‘0，2，1，3’代码：
2022-03-04 09:58:29
1653
6
原创 机试算法题-拼接url字符串
题目：拼接url，给定一个字符串，中间存在“，”隔开前后两个url，要求拼接这两个url，且中间有且只有一个“/”，拼接的要求：假如两个字符串为null 则结果为"/" ,否则结果为"/abc/abc"的形式。输出描述：1 、输入： ‘/a,/b’输出：’/a/b2 、输入： ‘a,/b/’输出：’/a/b3 、输入： ‘a,b’输出：’/a/b4 、输入： ‘/a,b’输出：’/a/b5 、输入： ‘/a/,/b/’输出：’/a/b6、输入：’,‘输出：’/’代码：<s
2022-03-04 09:34:17
939
原创 原生js实现数据双向绑定
双向绑定使用原生js实现数据的双向绑定。关于vue的双向数据绑定，其核心是 Object.defineProperty()方法Object.defineProperty()的作用就是直接在一个对象上定义一个新属性，或者修改一个已经存在的属性Object.defineProperty(obj, prop, desc)obj：需要定义属性的当前对象。prop：当前需要定义的属性名。desc：具体的改变方法。<!DOCTYPE html><html> <head&
2021-12-31 17:35:52
2634
原创 2021年前端面试题，经典
前言：前几天去面试然后被问到的几道面试题，感觉比较经典就来分享一下。1、sessionStorage，localStorage区别localStorage生命周期是永久的，除非主动清除localStorage的信息，否则这些信息将永远存在。存放数据大小一般为5MB，而且它仅在客户端（游览器）中保存，不参与和服务器的通讯。sessionStorage和localStorage相似，不同之处在于sessionStorage里面的数据会在页面会话结束的时候被清除。多个页面打开相同的url会创建各自的sess
2021-11-08 15:18:21
699
1
原创 前端iframe标签的妙用
iframe基本使用：iframe主要是在游览器的页面中划分出一部分地方用来放其他页面。打个比方如果想在自己做的页面里面嵌入淘宝的首页，那就把src设置为淘宝的链接。记得要设置一下class样式，不然默认高度为0就不会显示出来了。<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>这是一个iframe</title> </head> &l
2021-10-28 16:41:49
777
原创 html如何设置网页的背景图片
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <style type="text/css"> *{ padding: 0; margin: 0; } .big_box{ height: 100vh; background: url('./框架文件/three
2021-10-09 14:46:51
16747
1
原创 实现3D 场景——three.js学习篇六之划分模块
学习目标：当项目越来越复杂的时候，之前的写法就会显得很乱，很难看懂。所以我们要使用模块化开发，这样可读性会好很多，而且易于维护。用之前的一个球体的例子。代码：提示：<!DOCTYPE html><html><head> <title>球体贴图</title> <style type="text/css"> body { margin: 0; } canvas { width
2021-09-17 17:51:26
385
1
原创 实现3D 场景——three.js学习篇五之正方体贴图
学习目标：在上一篇中讲到如何在场景中放入多个物体。那么我们来设想一下，如果在放一个大的物体里面包裹着一个小的物体会怎么样呢？？？然后再给物体的各个面贴上图片会变成什么样呢？？？学习内容：1、 物体贴图2、 鼠标控制3、 自动旋转代码：<!DOCTYPE html><html><head> <title>贴图</title> <style type="text/css"> body
2021-09-17 14:23:20
1639
原创 实现3D 场景——three.js学习篇四之在场景放入多个物体
学习目标：在场景放入多个不同形状的物体代码：<!DOCTYPE html><html><head> <title>同时放入多个物体</title> <style type="text/css"> body { margin: 0; } canvas { width: 100%; height: 100%; } </style></head>
2021-09-14 18:37:55
1246
原创 实现3D 场景——three.js学习篇三之鼠标控制物体
学习目标：1、使用OrbitControls，让鼠标可以控制物体的旋转、平移、放大缩小。2、理解物体的形状geometry物体的geometry：var geometry = new THREE.SphereGeometry(60,40,40);//创建一个球体几何对象1、SphereGeometry：球体2、BoxGeometry：正方体（三个参数分别是长宽高）3、CylinderGeometry：圆柱体，第一个参数是顶部直径、第二个参数是底部直径、第三个是圆柱高度、第四个是圆周分段数（
2021-09-14 18:31:10
2401
原创 实现3D 场景——three.js学习篇二之理解基础概念
学习目标：理解3D 场景前置知识学习内容：1、场景(Scene): 场景是[物体,光源等元素]的容器.可以配合 chorme 插件使用,抛出 window.scene 对象,即可实时调整和场景相关的所有对象数据,包括物体,光源等.2、相机(Camera): 场景中的相机,代替人眼去观察.一个场景中有且只能有一个相机,一般常用的是透视相机(perspectiveCamera),遵循真实的物理场景法则 – 远小近大. 还有一个叫正交相机(一般 2D 平面场景游戏使用的比较多,物体的大小和远近无关)
2021-09-14 17:56:53
401
原创 实现3D 场景——three.js学习篇一之运行项目
学习目标：首先运行一个three.js的项目学习内容：1、 下载three.js包导入2、 复制代码3、 修改包的导入路径4、 跑起来代码：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>My first three.js app</title> <style> body { margin: 0; } c
2021-09-14 17:21:43
874
3
原创 js使用sort()进行对象数组的排序
代码：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>对象数组的排序</title> </head> <body> <button type="button" onclick="a()">根据年龄升序</button> <button type="button" onclick="b()"
2021-09-09 10:05:51
1083
原创 介绍几个90%算法题会用到的js函数，必须掌握的基础！！！
一、splice()作用：splice()，用于对数组进行新增、替换、删除的操作。第一个参数表示操作的位置，第二个参数表示操作数量、第三个参数和之后的是替换的元素1、删除数组中的指定元素 <script> let arr = ['abc','qwe','123',555,undefined,777] console.log(arr)//['abc','qwe','123',555,undefined,777] arr.splice(0,1)//参数0指从数组下标为0的位置开始，参数1
2021-09-03 16:39:12
203
原创 includes()的使用场景和作用。
问题：当在做逻辑判断的时候，发现不同状态下，会执行这个状态对应的操作，如果非常乱的时候，可以使用includes()来判断什么状态下应该执行什么样的操作。场景：应用场景:发送请求从后端拿到一个数据(状态),根据这个数据的数据(状态)来进行对应的操作. <script> /* */ var num = 7;//假设这是一个从后端拿到的数据，表示星期几 if([1,3,5].includes(num)){//如果星期一、三、五吃饭堂 console.log('吃饭堂
2021-08-31 18:30:50
19483
原创 vue2和vue3在使用element-ui日期选择框中禁用日期的实现
vue2中饿了么的日期禁用上了先上个官方文档，可以看见vue2的disabledDate是在picker-options里面的。因为vue2的写法应该把disabledDate写在:picker-options里面，可以使用这种写法。 <el-form-item label="预计收货时间" prop="estimatedDate" required> <el-date-picker v-model="formDa
2021-08-18 11:23:16
3486
9
原创 js实现数组去重，超容易理解
我想很多人都刷过数组去重的面试题吧，数组去重是面试中的基础题。简单快速学一点点知识。1、通过set方法实现。（写最少的代码）<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>数组去重</title> </head> <body> </body></html><script> var
2021-08-05 18:02:27
219
原创 使用原生js实现的简易计算器
使用原生js实现的简易计算器代码：<!doctype html> <html> <head> <meta charset='UTF-8' /> <title>简易计算器</title> </head> <style type="text/css"> body, ul, li,select { margin: 0; padding: 0; b
2021-08-03 16:24:06
346
原创 使用原生js实现抽号、抽奖的功能，Math.random()的使用
代码：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>抽学号</title> </head> <body> <div id='a1'> <span id="data"></span> </div> <button onclick="handlechange
2021-07-28 17:15:00
1189
原创 使用vue和element实现点击按钮多选同时打开多个页面的效果
<template> <div> <h1>同时打开多个页面</h1> <el-checkbox-group v-model="checkList"> <el-checkbox label="http://www.baidu.com">百度</el-checkbox><br/> <el-checkbox label="http://www.taobao.
2021-07-22 16:18:22
2388
2
原创 必须要懂的，在前端开发中比较常用的几个方法
学习内容：1、 数组或者对象合并（深拷贝）2、 数组或者对象解构3、 map()方法的使用数组合并（深拷贝）：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> </body> <script> let arr = ['a','b','c
2021-07-06 11:48:25
299
原创 react生命周期函数的使用例子
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script> <script src="https://cdn.
2021-06-30 16:39:21
136
原创 超多动态效果网站源码，免费下载
地址：https://www.jq22.com/功能非常丰富。而且资源很多都是免费，效果超级好，安利一波。拿个例子出来:这是一个小猫追着鼠标走的效果。效果展示：跳转展示页面
2021-06-17 11:05:44
3419
原创 什么是节流与防抖、用例子说明
例子：拷贝代码，按f12查看打印的数据。<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>节流与防抖</title> </head> <body> <button id="a1">提交</button>（模拟表单提交） <br /><br /> 输入框：<inpu
2021-06-16 16:40:28
904
原创 win10黑科技，新建桌面非常好用
1、快捷键：ctrl + win +backspce（后退健）进入上图的任务视图页面，新建桌面。（也可以鼠标右键桌面下面的任务栏，点击显示“任务视图”按钮，点击任务视图进入到上面的图片页面，然后新建桌面。）2、快捷键：ctrl + win + 左右键可以自由切换桌面，方便程序员开发时桌面打开的东西太多太乱，分类处理。又可以用在做这一件事的时候，突然又多了一件事要做，为了保持桌面整洁就可以切另一个桌面来做了。...
2021-06-16 11:37:37
3126
原创 vue在输入框点击回车后聚焦另外一个输入框
代码：<template> <div><el-input v-model="input" placeholder="用户名" @keyup.enter.native='a1()'></el-input><el-input v-model="input2" placeholder="密码" ref="password"></el-input> </div></template><scrip
2021-05-10 21:25:12
1400
1
原创 怎么打开运行一个vue脚手架搭建的项目
1、下载好的文件下找到package.json这个文件。2、用编译器打开它的上级目录。（图片的上一级目录是VUE-ERP,你的项目名不一样）3、下载依赖。输入命令：cnpm install（cnpm下载有时莫名其妙的出bug）npm install （很慢，小型项目还行）yarn （要先下载yarn才能用，建议，很好用）3.1 为什么有3.1？有时候下载依赖的时候会出错，尝试一下删除依赖文件重新下载。node_modules这个文件整个删除。（如果下载依赖没事，跳过这个3.1
2021-05-10 10:33:52
4186
2
原创 html实现简易音乐播放器
目标：使用vue.js导包的形式做一个简单的音乐播放器，新手也很容易看懂。内容：1、 使用了flex实现响应式布局；2、 使用min-width防止字体被压缩；3、 使用computed计算属性对歌曲的路径缓存；4、 掌握基础的vue指令的使用；效果图：代码：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>简易音乐播放器</title&
2021-04-30 15:37:46
11717
21
原创 模仿csdn博客头部的代码
效果图：代码：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>模仿csdn头部</title> </head> <style> body{ padding: 0; margin: 0; min-width: 1500px; } .head{ height: 50px; width:
2021-04-28 09:51:24
1332
2
原创 html字体大小动态变化，会呼吸的字体
目标：使用css3实现字体大小动态的改变代码<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>会呼吸的字体</title> </head> <style> .font1 { animation:bian 5s infinite; -webkit-animation:bian 5s infinite
2021-04-23 19:40:31
5217
原创 二级菜单导航栏（左侧）
目标：实现左侧的二级导航栏效果图：项目演示：点击跳转到演示地址代码：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>左侧导航栏</title> </head> <style> body{ margin: 0; padding: 0; min-width: 1200px; min-he
2021-04-23 11:53:51
17863
20
原创 弹窗和悬浮框的实现
目标：实现弹窗和悬浮框的功能内容：1、 页面打开的时候跳出弹框。2、 点击关闭按钮后弹窗消失，变成悬浮框显示在网页右方中间。3、 点击悬浮框的关闭按钮关闭悬浮框。4、 点击图片跳转到淘宝页面。5、使用jquery实现淡入淡出的动画效果。代码：<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>弹窗广告</title> <s
2021-04-22 10:29:33
6075
2
原创 div背景透明度动态改变的效果
目标：使用定时器实现div背景色的透明度动态改变注意：这里没有进行兼容处理，别使用低版本的ie游览器！！！代码： <!doctype html><html> <head> <title>div背景透明度动态改变的效果</title> <meta charset="utf-8" /> </head> <body> <div class="
2021-04-15 17:34:39
408
原创 js实现玫瑰动画效果
目标：使用canva和js实现玫瑰的动画。代码： <!doctype html><html> <head> <title>红玫瑰</title> <meta charset="utf-8" /> </head> <body> <canvas id="c"></canvas> <script> var b
2021-04-15 15:13:59
1311
原创 鼠标移入图片旋转的效果
#目标：实现一个鼠标移入图片，图片旋转180度的效果。代码： <!doctype html><html> <head> <title>鼠标移入旋转效果</title> <meta charset="utf-8" /> </head> <body> <div class="box"></div> </bod
2021-04-15 14:38:17
1663
1
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人