前端基础通用知识(h+css+js)
文章平均质量分 53
基础巩固,技能提升
阿渊啊啊啊啊啊啊啊啊啊啊啊啊
生如浮萍般卑微 爱却苍穹般壮烈
展开
-
generator的分享
generatorgenerator yield配合使用一、generator介绍 1.generator函数式es6引入的,用于异步编程 2.最大特点是可以交出函数的执行权(暂停函数) 3.和普通函数写法区别function关键字和函数名之间有一个星号内部使用yield,定义不同的状态本质上generator函数是一个异步任务的容器,yield命令是不同状态的分界线。function* gen(){ yield 'a'; yield 'b'; yield 'c'; ret原创 2021-10-17 23:51:32 · 159 阅读 · 0 评论 -
websocket的分享
一:什么是webSocket ?webSocket是HTML5出的新协议,2011年成为国际标准。所有浏览器都已经支持了WebSocket协议支持,服务器可以主动向客户端推送信息,客户端也可以主动向服务器发送信息,是真正的双向平等对话,属于服务器推送技术的一种。(兼容性:ie10)二:和传统的http请求比较http:一个request只能有一个response。而且这个response也是被动的,不能主动发起。webSocket:服务端就可以主动推送信息给客户端[外链图片转存失败,源站可能有防原创 2021-09-21 23:16:49 · 282 阅读 · 0 评论 -
前端如何使用代理解决跨域问题
之前一直都是让后端通过配置Access-Control-Allow-Origin来解决跨域这一问题,现在尝试自己使用代理解决,并总结下来共同学习。使用代理分两种情况:1、开发中使用webpack的代理服务器在前端项目中我们通常使用webpack来打包和运行项目,因此在webpack的devServer配置里面添加代理参数devServer:{ proxy:{ "/login_key":{ target:"https://loginurl.net/原创 2021-04-17 11:27:06 · 1858 阅读 · 0 评论 -
通用jsbridge封装
/** * 用法: * import jsBridge from 'fileName.js' * * 1、给 APP 端发送数据 * jsBridge.callHandler(eventName, data, callback(reponseData)) * 参数说明: * eventName (string): 必传, 与 APP 端约定的事件名 * data (object...原创 2020-03-04 09:11:32 · 796 阅读 · 0 评论 -
给定数组里选出随机位数的和为固定值sum(从n个数字中选取多个相加,结果为m )
直接代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equ...原创 2019-09-19 10:27:15 · 1533 阅读 · 0 评论 -
js下载处理文件格式(base64,二进制)
file.blob().then(blob => { let a = document.createElement('a'); let url = window.URL.createObjectURL(blob); let filename = `${moment().format('YYYY-MM-DD')}导入失败药品.xls...原创 2019-09-04 10:40:35 · 976 阅读 · 0 评论 -
js时间转化函数,时间戳转年月日时分秒随意搭配格式
/** * 修改时间戳 * fmt 例如:yyyy-MM-dd hh:mm:ss || yyyy-MM-dd || yyyy.MM 等等,可随意搭配年月日时分秒 */function getDate(val, fmt) { if (!val) { return ''; } if (val && val.length == 10) { ...原创 2019-04-30 15:50:24 · 666 阅读 · 0 评论 -
前端向全栈前行的第一步
写在前头,写了一段时间的前端,各种前端工具技术都是用过了,已经能自己完成前端的页面任务,不过在搭建自己的网站博客或者想做一个什么样的产品时总归会感觉自己知识的局限性,无法自己完成一个骨肉丰满的可交互的网站的无力使我决定向全栈工程师前行。要看下面内容除了前端(js,css,html)的技术的需要粗略的掌握以下知识:node.js mysql操作使用的后端技术栈为node(ejs模板)和mysq...原创 2019-02-19 13:55:31 · 207 阅读 · 0 评论 -
使用js动态修改元素的伪元素before或after
初始样式代码<div class="formBox" ref='indentDom' id='indentDom' ></div>.formBox { &:before { content: '*'; position: absolute; left: 7px; font-size: 14px;...原创 2019-07-17 09:23:02 · 6543 阅读 · 0 评论 -
css小于12px的文本强制按照 12px 显示解决办法,CSS文字两端对齐...
1、Chrome中文界面下默认会将小于 12px 的文本强制按照 12px 显示 解决方法:可通过加入 CSS 属性 -webkt-text-size-adjust:none;解决2、CSS文字两端对齐 解决方法:可通过加入 CSS 属性 text-align: justify,并给对应标签一个伪类after(display:inline-block;)...原创 2019-04-08 14:48:22 · 637 阅读 · 0 评论 -
css初始化样式
因为浏览器的兼容问题,不同浏览器对有些标签的默认值是不同的,如果没对CSS初始化往往会出现浏览器之间的页面显示差异。 当然,初始化样式会对SEO有一定的影响,但鱼和熊掌不可兼得,但力求影响最小的情况下初始化。body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset...原创 2019-03-12 14:14:40 · 123 阅读 · 0 评论 -
基于axios封装的api请求函数
在vue2.0不推荐使用vue-resource之后,大部分人的选择基本上都是axios,axios不光在vue上用,在angular和react上也能用。所以学会用它总会有用的。 如果你属于还不知道怎么用的话,先看一下这篇文章:https://www.kancloud.cn/yunye/axios/234845。 如果每次发起请求都完完整整的写一遍的话就会...原创 2018-08-29 17:46:06 · 1389 阅读 · 1 评论 -
最常用的js设计模式总结
策略模式要解决if扎堆最好的办法是什么?答:策略模式核心将算法的使用和算法的实现分离开来。一个基于策略模式的程序至少由两部分组成:第一个部分是一组策略类(可理解为构建一个json对象),策略类封装了具体的算法,并负责具体的计算过程。第二个部分是环境类Context,Context接受客户的请求,随后把请求委托给某一个策略类。=需要使用这个对象。// 加权映射关系(策略类)var l...原创 2020-04-28 11:24:29 · 202 阅读 · 0 评论 -
使用echarts中国地图上绘制散点图(自适应宽高)
先上最终效果图(显示公司在中国各个城市药店分布图)我这边使用的技术栈是react,不熟悉的可走:https://zh-hans.reactjs.org/首先使用npm安装echartscnpm install echarts --save除此之外,我还自己引用了两个json,分别是chainaJson(http://datav.aliyun.com/tools/atlas/#...原创 2019-10-09 11:55:28 · 7329 阅读 · 0 评论 -
身份证号正则验证及提取性别出生年月出生时间
正则验证:reg = /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;通过身份证号获取性别:getSex(idCard) { var sexStr = ''; if (parseInt(idCard.slice(-2, -1)) % ...原创 2019-07-11 15:58:34 · 3048 阅读 · 0 评论 -
工作项目问题记录贴
不定期更新遇到的问题及解决办法。1.Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported在使用canvas base64格式转为图片时遇到的问题,这是受限于 CORS 策略,会存在跨域问题,虽然可以使用图像(比如append到页面上)但是绘制到画布上会污染画布,...原创 2019-07-03 15:28:45 · 119 阅读 · 0 评论 -
base64格式图片转为二进制图片文件及new File兼容性解决
base64格式时图片打印出来为data:image/bmp;base64,LASDJFLKAJDFLKASDJFL...很长一大截转化函数function dataURLtoFile(dataurl, filename = 'file') { let arr = dataurl.split(',') let mime = arr[0...原创 2019-07-03 11:18:05 · 3043 阅读 · 4 评论 -
js中对象当做参数传递是否改变自身
先套用js高程一句话——ECMAScript 中所有函数的参数都是按值传递什么叫做按值传递???可以简单理解为生成一个新的变量和需要传递的参数的值一样,就像把值从一个变量复制到另一个变量一样。var a = 1;function num(o){ o = 2; return o;}obj(a);console.log(a);//1 看上面的代...原创 2019-04-24 17:05:59 · 2345 阅读 · 0 评论 -
网页引用优酷视频并添加封面自动播放
引用优酷视频可以减轻公司的服务器压力,而且和自己上传保存视频相比会方便轻松许多,不过相对的需要忍受广告。首先你需要在优酷里找到你要引用的视频,或者自己上传。然后打开会有一个分享按钮:以我使用的第二个为例,复制下来如下:<embed src='http://player.youku.com/player.php/sid/XNDAwOTEyMTgyNA==/v.swf' allowF...原创 2019-02-27 15:36:30 · 3542 阅读 · 0 评论 -
js前端base64转码解码
我们为什么要用basebase64是网络上最常见的用于传输8bit字节代码的编码方式之一。有时我们需要把二进制数据编码为适合放在URL中的形式。这时采用base64编码具有不可读性,即所编码的数据不会被人直接看出。除此之外,还可以放在请求头,响应头进行传输。 最方便的转码解码window.atob() 与window.btoa()Window.atob() 函数用来解码一个已经被b...原创 2018-09-29 14:10:32 · 34234 阅读 · 5 评论 -
【js进阶】深浅拷贝,随机排序,遍历循环
1. Object.assign()官方描述:如果目标对象中的属性具有相同的键,则属性将被源中的属性覆盖。后来的源的属性将类似地覆盖早先的属性。简单来说,就是该方法有两个或或以上个参数,且参数都为json对象格式,后面的参数里面的属性值将覆盖前面第一个参数的相同属性的值,如果没有则新建一个属性值。且除了原先的对象会更改,还会新建一个对象,属于浅拷贝。举例说明var player...原创 2018-08-07 16:41:53 · 374 阅读 · 0 评论 -
时间转化函数
/** * 修改时间戳 * fmt 例如:yyyy-MM-dd hh:mm:ss */export function getDate(val,fmt) { if (!val) { return ''; } if (val && val.length == 10) { val = parseInt(val*1000);...原创 2018-07-04 15:53:03 · 940 阅读 · 0 评论