前端展现
文章平均质量分 69
前端展现
苛学加
我心澎湃,一往无前
展开
-
八千字带你进入正则表达式的世界, 使用少量的代码完成数据验证/提取/替换等操作
先试试正则表达式可以很方便的在字符串中提取我们想要的信息。例如:现在需要依次提取字符串中“a10b21c32”中的数字,及返回[10,21,32]。var str = "a1b2c3";var patt1 = /\d+/gi;var ls = str.match(patt1);alert(ls) //提示:10,21,32正则表达式可以对字符串进行格式验证。例如:我们用户注册的时候,要求用户名可以包含字符、数字、下划线,并设置用户名的最小长度为6,最大长度为15。var patt1 =原创 2020-10-10 15:53:49 · 761 阅读 · 4 评论 -
Flex弹性布局,满足你所有姿势
flex 布局flex布局(也叫弹性布局)是比传统方式更加灵活的布局模式。也是使用uni-app框架的推荐布局模式。随着IE浏览器的逐渐消失,PC端也迎来了对flex的全面支持。flex布局结构flex布局主要有外层元素和直接子元素构成。外层元素叫 flex container(容器)直接子元素叫 flex items (子项)flex布局开启直接在样式中设置display值为flex或inline-flex即可。flex (块状)inline-flex (一行)布局模型从原创 2020-11-11 16:16:54 · 775 阅读 · 1 评论 -
小程序开发跳转H5页面必须完成域名验证,肯定不让这一步影响到开发进度和汇报工作
小程序可信域名验证虽然微信小程序至此打开H5页面,但是相关的H5页面的域名必须完成微信平台的可信域名验证工作。及在域名所在的服务中部署从微信平台下载的验证文件,但在一些大公司或其他特殊情况下,这个步骤会变得非常缓慢。一些小程序开发新手可能会因此面临问题,如:做好的功能无法让领导在自己的手机上进行查看。其实,你只需要在对方的微信上打开对应小程序的调试模式,就可以正常使用了。...原创 2021-09-26 20:03:49 · 1401 阅读 · 0 评论 -
微信小程序简介、设计规范、运营规范等基础知识
微信小程序原生开发入门以往的开发中均使用的uni-app+uview的框架来实现的小程序开发。用到的样式及方法也都是uni-app体系中的,虽然和原生微信小程序相似但并不等同。有的公司要求使用原生微信小程序开发,那么今天就来总结一下原生小程序的开发知识点。一、设计指南微信小程序设计指南 – 官方说明首先是小程序的整体设计风格和交互思路。这是开发一款小程序说需要了解的第一步,建议大家跳转官方文档详细阅读。虽然一些优秀的小程序并未完全遵循“微信小程序设计指南”中的建议,那是因为他们本身在设计上足原创 2021-08-24 14:41:41 · 2284 阅读 · 0 评论 -
前端常见框架及组件的大体认识
前端常见框架1. vuevue 于 2014 年 2 月由 Google 前员工尤雨溪发布。在国内,vue有着得天独厚的优势,因为它的作者是华人尤雨溪,技术文档相对友好。在有HTML,CSS,JavaScript的基础上,可以快速上手。2. angularangular 于 2010 年 9 月由Google发布。学会用 Angular 构建应用,然后把这些代码和能力复用在多种多种不同平台的应用上: Web、移动 Web、移动应用、原生应用和桌面原生应用。相比于vue的轻巧,angul原创 2021-08-16 17:08:10 · 2091 阅读 · 0 评论 -
JavaScript Date 日期与时间,时区、时间戳等概念及常用工具
日期时间内容时区注意事项iOS上时间不能为24:00:00,应该为23:59:59。iOS上字符串转日期时,尽至此格式yyyy/mm/dd。原创 2021-07-22 16:21:46 · 4841 阅读 · 3 评论 -
精心整理制作,带你直观了解 JavaScript Array(数组)对象的相关方法,提高对数组的认知!
Array 数组Array提供了很多好用的方法,掌握以下方法将提高你对数组数据处理的速度。已ECMAScript 6版本为标准。一、赋值方法1. push 追加新项添加到数组的末尾,并返回新的长度。语法array.push(item1, item2, ..., itemX)图例示例代码//需求:将值4追加到array1中let array1 = [1, 2, 3];let result = array1.push(4);console.log(array1); /原创 2021-07-21 18:16:17 · 314 阅读 · 2 评论 -
ES6 可能出现的兼容问题及处理方法
ES6ECMAScript 6(简称ES6)是于2015年6月正式发布的JavaScript语言的标准,正式名为ECMAScript 2015(ES2015)。新的标准很友好,提供了如箭头函数等好用的特性,感兴趣的可跳转JavaScript ES6语法新特性整理,ES6必须掌握的知识点,更强大更方便。兼容问题同时也给我们带来了一些兼容性上的问题。在安排测试人员对功能进行测试的时候,发现了一个问题:在他们自己使用的手机上,怎么测试都是正常的;但是一换到公司的测试手机上就用不了了。因为公司的测试手原创 2021-07-15 11:06:05 · 2519 阅读 · 0 评论 -
使用canvas的toDataURL方法将图片转为base64报错:Tainted canvases may not be exported
1.情景展示 当使用canvas 将图片转为base64报错信息如下:Uncaught DOMException: Failed to execute ‘toDataURL’ on ‘HTMLCanvasElement’: Tainted canvases may not be exported2.解决方案 第一种情况:本地测试&图片引自本地通过file协议打开的html文件进行的本地测试解决方案:放在服务器上就可以正常转换了!第二种情况:被转换的图片,引自网络或者服务器解决方案原创 2021-07-02 09:38:56 · 3193 阅读 · 1 评论 -
使用canvas对图片进行裁切
canvascanvas 又叫做画布,是 HTML5 新增内容,可以使用js脚本在其中绘制图像的元素。常用于制作网页上的一些毕竟炫酷的前端特效。可以完成图片处理、动画渲染、图表渲染等操作。最近用uni-app的推流组件做了个已证件照拍摄的相机,但是拍照完成后还需要对图片进行裁切,才能真正使用。今天就来看看如何使用canvas对图片进行剪切。...原创 2021-06-15 17:33:23 · 16222 阅读 · 5 评论 -
烦人的IE浏览器兼容问题,F12开发模式正常,普通模式就不行
IE 浏览器的兼容问题在一些特殊的情况下,我们还是需要对IE浏览器进行适配,比如涉及和一些硬件设备的连接上。用了IE就避免不了一些兼容上面的问题。我最近一个项目中需要使用IE调用高拍仪和指纹采集设备,遇到了一个容易被忽视的小问题。一、各个版本间的兼容问题一般,我们会对各个版本所支持的一些特性进行兼容处理。比如let str = 'aaa';在IE10及以下版本的浏览器上就会报错,所以我们需要改为var str = 'aaa';。通常,此类兼容性问题还是比较好定位和处理的,会后明显的报错提示,就原创 2021-06-02 18:37:43 · 1611 阅读 · 2 评论 -
已知屏幕的分辨率,整么计算屏幕比例?
屏幕比例原创 2021-04-30 18:06:20 · 6946 阅读 · 1 评论 -
自建导航页,如何获取网站在浏览器上显示的图标
网站图标在访问一个网站时,通常会在浏览器标签的左上角显示网站对应的图标。在做自定义导航这类页面时,为了显示效果,通常会把网站图标显示出来。如何获取网站图标在通常情况下,只需要在网站域名后加上/favicon.ico就可以访问图标文件。如:https://www.baidu.com/favicon.ico但是也有部分网站无法通过此方法获取图标,要么是地址不标准,要么是没设置图标。遇到这类情况只能自行设置图标或显示默认图标。...原创 2021-04-14 10:58:33 · 2123 阅读 · 0 评论 -
使用nginx代理实现前后端分离开发调试,零基础教程
老项目前后端分离开发调试在前后端没有完全分离部署的情况下,前端人员调试是很不方便的,有的时候本地后端相关配置不正确,会导致无法正常调试,浪费大量时间。今天就来一起学习一下怎么使用Nginx代理来进行前后端分离开发。...原创 2021-04-13 17:14:38 · 1682 阅读 · 0 评论 -
WEB端和微信小程序端的文档文件在线预览方法
文件的在线预览方式汇总一般常见的文件有office套装、pdf、txt、md、和音视频。音视频的预览是单独一块,今天主要说说文档文件的在线预览功能。在手机上,要有好的效果,可以集成使用第三方的文档预览SDK,有效果好操作流程的特点,但是也不属于今天的话题。一、WEB端在线文件预览1. 微软office在线预览最最简单的方式就是使用官方提供的预览链接:https://view.officeapps.live.com使用方式如下:https://view.officeapps.live.com原创 2021-04-13 10:18:25 · 3584 阅读 · 0 评论 -
前端打包工具webpack的基础认知
webpackwebpack是一个构建工具,中文名称叫“静态资源打包器”。webpack简介相对于原始的web前端开发(html+js+css),现在有很多的新技术。我最先接触到的是less,它支持变量、嵌套等功能,能帮助我更好的维护项目的css样式。然而,在使用less的过程中,虽然有管理css样式方便了;但是每次发版的时候还需要先把less文件先转成css文件才行;否则浏览器也不能识别,导致报错。还有我们使用module.exports模块化编写js时,发版时也需要先进行编译后浏览器才能识别原创 2020-08-07 17:54:35 · 223 阅读 · 0 评论 -
跑一个hello nodejs程序,并使用webpack进行打包
helloNode我们使用HBuilderX创建一个web项目,取名为“helloNode”。目录结构helloNodejsmain.jsmodule.jsindex.html文件代码main.jsvar module = require('./module') // 引用模块,可省略 .js 后缀名module.sum(); // 调用 module.js 中的函数module.js// node 模块化编程, 导出函数module.exports = {原创 2020-08-06 18:22:38 · 260 阅读 · 0 评论 -
Noed.js 是个啥
一种javascript的运行环境,能够使得javascript脱离浏览器运行。原创 2020-08-06 16:37:17 · 411 阅读 · 0 评论 -
初识npm包管理工具
npm初识最近准备找一个现代的前端ui框架,看了如:腾讯的QMUI饿了么的Element-Ulbootstrape…他们的资源都提供了同一种下载方式:npm。以前我所接触的前端开发都是html+css+javascript。需要展示树形结构就自己写个tree.js或者网上找一个js拿来引用。这种方式在当下应该算是远古开发方式了。初见漫天遍野的 npm,直觉告诉我,这是一个好...原创 2020-04-22 17:38:40 · 204 阅读 · 0 评论 -
TypeScript的认识与入门学习
TypeScriptTypeScript是JavaScript的超集,是由微软公司开发的。他处理了JavaScript的一些问题,更加适合开发大型项目。在实际使用时,需要先编写.ts文件后在转换为.js文件使用。TypeScript入门开发环境安装node.jsnpm i -g typescriptvscode变量类型number 数字let count: number = 12; //数字string 字符串let name: string = '姓名'; //字符串原创 2021-01-21 16:24:50 · 320 阅读 · 0 评论 -
JavaScript ES6语法新特性整理,ES6必须掌握的知识点,更强大更方便
ECMAScript 6入门原创 2020-11-18 22:07:51 · 638 阅读 · 0 评论