web前端学习
文章平均质量分 72
要做前端的一股清流
想写点老少皆宜的代码
展开
-
AWS Amplify 部署node版本18报错修复
Build Error : Specified Node 18 but GLIBC_2.27 or GLIBC_2.28 not found on build原创 2023-08-04 22:45:06 · 1583 阅读 · 1 评论 -
Input输入框type=number时仍然可以输入特殊字符-、+、e的解决方案
一、起因同事用了输入框type=number但测试的时候发现 - 、+ 、 e 都可以输入<input type="number" />查阅了这个属性目前浏览器的支持程度查阅后发现 type = number 在手机浏览器端的支持率很低。表里显示IOS 13.4支持了这个属性,但实测发现虽然弹起了数字键盘,但是仍然可以输入特殊字符。最奇葩的是当你在支持这个属性的web浏览器端使用 type = number 时,输入 + 、- 、e时,是不会触发onChange的.原创 2020-06-01 16:27:35 · 7856 阅读 · 7 评论 -
活用less:遍历生成margin/padding/fontSize等类名
起因: 之前项目里写margin/padding之类的样式都是用的穷举的方式,实在觉得冗余又繁琐。下面直接贴代码,解放你的双手一、/* margin padding fontSize width 通用样式表 免去你每次重写样式的烦恼 marked by Jacky*/.loopStyle(@counter) when (@counter > 0) { ...原创 2020-04-29 19:23:36 · 1464 阅读 · 0 评论 -
快速入门React引入富文本编辑器 -- wangEditor
前言:记录一下工作中使用的比较方便的富文本组件,本文包含1. 初始化。2. 将html文本赋值给编辑器。3. 在编辑器中上传图片。4. 获取编辑器中的内容一 、 引入yarn addwangeditor / npm installwangeditorimport E from 'wangeditor';初始化编辑器: compone...原创 2019-12-07 15:04:14 · 1228 阅读 · 0 评论 -
js中时间日期与时间戳相互转换的方法
恰好这周需求中有用到日期格式与unix时间戳的相互转换,查阅了一些资料,就打算写一篇博客总结一下。但愿这篇文章足够简单粗暴,让你一目了然,有所收获。一、日期格式转换成时间戳var timeStamp = new Date("日期");/* 目前我知道的支持转换的时期格式为: 1. "2018/1/1 8:00:00"; 2. “2018...原创 2018-12-01 22:53:59 · 1189 阅读 · 0 评论 -
解决Module build failed: BrowserslistError: Unknown browser query `dead`的问题
最近在使用create-react-app构建项目的时候,执行npm run build命令,报错:Module build failed: BrowserslistError: Unknown browser query `dead原因:在git上搜了一遍之后,发现是create-react-app在创建application的时候下载依赖使用了旧版本的BrowserslistEr...原创 2019-01-11 15:55:56 · 27907 阅读 · 2 评论 -
理解react-router路由跳转路径上的“#”
碎碎念:之前用react-router的时候直接用的旧项目默认配置,没有仔细去了解为什么url上面会自带#,趁着周末查阅了一下资料,自己总结一下。一、理解什么是react-router history直接拿开发文档里的原话:React Router 是建立在 history 之上的。 简而言之,一个 history 知道如何去监听浏览器地址栏的变化, 并解析这个 URL 转化为 lo...原创 2019-02-24 22:20:11 · 5028 阅读 · 0 评论 -
解决部分安卓微信浏览器或者webview中window.reload()失效的问题
最近发现安卓系统在微信浏览器和webview里不支持window.location.reload() 和 window.location.href场景://无效代码let old_url = wwwe.baidu.com?lang=en; // 当前urllet new_url = www.baidu.com?lang=zh; // 目标urlwindow.location.h...原创 2019-03-22 21:40:42 · 7021 阅读 · 2 评论 -
React生成二维码并将canvas转换成img格式
1. 导入包生成二维码npm install qrcode.reactnpm包链接:https://www.npmjs.com/package/qrcode.react1.1 生成二维码:import * as QrCode from 'qrcode.react'render() { return ( <QrCode value={“二维码内...原创 2019-04-02 21:42:08 · 4932 阅读 · 1 评论 -
重新学习Array.reduce()
最近在项目里抠语言包的过程中发现做了很多重复的工作,然后同事指点了一下reduce这个方法,仿佛打开了新世界的大门。遂重新学习了一下reduce的用法。在博客记录一下。提示:努力想把文章写的精简,但是觉得关于这个函数很多细节想写。所以这篇观感可能会是: 博主是个bb怪。测试:如果你能理解下列函数的原理,那么这篇文章你完全没有阅读必要。// 版本1[...new Array(1...原创 2019-08-27 17:53:28 · 375 阅读 · 0 评论 -
前端秋招总结[二]
第二篇主要记录面试题和自己准备的知识点。不区分公司。原创 2017-11-06 09:57:04 · 452 阅读 · 0 评论 -
前端秋招总结[一]
距离签下offer到现在休息了大半个月了,偷懒了这么久,现在把九月初开始的秋招历程总结一下。先说一下自己对参加笔试面试公司的体验,再把面经分享给大家。大部分面经我没有分公司记录。(一) 笔试公司:百度、腾讯、头条、搜狐、去哪儿、小米、网龙、4399、吉比特、H3C、CVTE 笔试题偏前端:百度、头条、网龙、4399、CVTE 笔试题偏数据结构算法:腾讯、去哪儿、小米、H3C 笔试题画风清奇考原创 2017-11-05 10:58:57 · 1282 阅读 · 1 评论 -
link与import的区别
老是记不住两者的区别,所以留一篇文章。以便日后面试需要有 4 种方式可以在 HTML 中引入 CSS。其中有 2 种方式是在 HTML 文件中直接添加 CSS 代码,另外两种是引入 外部 CSS 文件。下面我们就来看看这些方式和它们的优缺点。内联方式内联方式指的是直接在 HTML 标签中的 style 属性中添加 CSS。示例:这通常是个很糟糕的书写方式,它只能转载 2017-05-26 17:17:48 · 1342 阅读 · 0 评论 -
理解为何需要清除浮动及清除浮动的方法
本文主要讲为什么要清除浮动及解释bfc,及其包含浮动的原理。原创 2017-05-19 12:10:52 · 30049 阅读 · 3 评论 -
JSONP跨域请求数据报错 “Unexpected token :”的解决办法
Jquery使用ajax方法实现jsonp跨域请求数据的时候报错 “Uncaught SyntaxError: Unexpected token :”,主要问题在于返回的数据格式不正确本地虚拟两个域名,分别为:www.test.com、www.abc.comhttp://www.test.com/index.html页面点击按钮,请求返回 www.abc.com域名目录下的文件的数转载 2017-06-05 15:28:33 · 16166 阅读 · 1 评论 -
css修改select标签默认样式
之前写select选择框的时候就发现pc端在不同浏览器会有不同样式,在移动端更是丑的厉害。于是在网上扒拉总结了几个清除默认样式的方法,以备日后之需。一、ios端去除默认样式:background-color:transparent; border-color:transparent;安卓端仅使用上面的代码不够,会发现某些浏览器会出现箭头和高亮情况。要加上下面一条语句,取消w原创 2017-06-03 18:49:42 · 5519 阅读 · 0 评论 -
浅析font-family属性及在不同浏览器显示差异问题
主要就在body中定义了字体样式但仍无法正确显示字体效果的问题进行了一系列的解决和调研...原创 2017-07-10 14:05:22 · 15397 阅读 · 1 评论 -
JS/Jquery实现导航栏顶部吸顶效果(一)
如何用js/jquery实现吸顶效果转载 2017-05-23 11:29:30 · 4995 阅读 · 0 评论 -
JS/Jquery实现导航栏顶部吸顶效果(二)
之前我写了如何实现导航栏的吸顶效果,但是是产品需要,就简单写了一下,但是没有仔细的去把握属性,导致后来再加效果的时候遇到了些麻烦。今天这篇文章主要是写:如何在实现顶部吸顶效果的基础上点击导航栏按钮定位到特定位置。(一) 接着第一篇文章的代码。第一点的想说的是我之前没有把握住的属性:scrollTop 第一篇文章我直接复制了一堆定义,在那里,给出的是: scrollTop:设置或获取原创 2017-07-12 15:04:44 · 7139 阅读 · 0 评论 -
js原生写图片轮播和切换
网上有很多轮播图的写法,有一些我觉得写的太过繁琐可读性差。所以我自己写了两个js块。第一个是轮播图写法,第二个是通过点击左右箭头切换图片。这里主要是展示js代码,省略了样式。1.js原生写轮播图.prev,.next{ cursor: pointer;}.showpic{ display: none;} >原创 2017-05-12 16:38:35 · 7839 阅读 · 3 评论 -
今日头条秋招前端笔试附加题解题思路
今日头条秋招前端笔试题,网易、搜狗笔试题原创 2017-09-11 12:14:37 · 1011 阅读 · 0 评论 -
浅析Jquery里slick插件常用属性用途
最近第一次接触到jquery的slick插件,由于是修改别人的代码,所以不得不查了一下插件的文档。发现网络上大多数都是官网文档,所以打算自己写一个demo对一些没搞明白的属性做一个说明和记录。这里只用到了一些常用属性,博主觉得基本够用。 $('.slick').slick({ dots:原创 2017-05-11 11:56:57 · 6804 阅读 · 0 评论