慕容屠苏
定期分享前端、互联网、人工智能知识,喜欢的朋友关注我哟--
展开
-
html打包成exe文件electron-builder
html打包成exe文件electron-builder第一步:cnpm install electron -ggit clone https://github.com/electron/electron-quick-startcd electron-quick-startcnpm installnpm start第二步"scripts": { "pack":...原创 2019-12-09 23:55:33 · 1522 阅读 · 2 评论 -
web前端性能优化汇总
性能优化:一、减少请求资源大小或者次数 1、尽量和并和压缩css和js文件。(将css文件和并为一个。将js合并为一个) 原因:主要是为了减少http请求次数以及减少请求资源的大小 打包工具: webpack gulp grunt. ....2、尽量所使用的字体图标或者SVG图标来代替传统png图 因为字体图标或者SVG是矢量图,代码编写出来的,方大不会变形,而且渲染速度快3、采用图片的懒加载(延迟加载) 目的为了,减少页面第一次加载过程中http的请求次数原创 2020-10-24 22:47:38 · 318 阅读 · 0 评论 -
Jquery使用animate实现css3的平移动画效果
Jquery使用animate实现css3的平移动画效果实现效果:首先,Jquery并不支持在animate的样式中的transform效果,这里通过使用animate的回调函数来实现。 position: fixed; bottom: 40%; right:220px; /*display: inline-block;*/ display: none; width:40px; height:180px; line-height:35.6px; background:li.原创 2020-05-18 16:20:13 · 1900 阅读 · 0 评论 -
JS里中小数的乘法运算时会出现浮点错误
JS里中小数的乘法运算时会出现浮点错误<script>alert(11*22.9)</script>结果是251.89999999999998 而不是251.9<script>alert(11*1000*(22.9)/1000);</script> 结果是251.9解决问题的大概思路就是,先把因数放大为整数,最后再除以相应的倍数,这样就能得到正确的结果了。...原创 2020-05-09 11:53:52 · 688 阅读 · 0 评论 -
解决JS中浮点数乘法错误问题
解决JS中浮点数乘法错误问题alert(39.2*3);我们直接结算,随后输出:117.60000000000001对于浮点数乘法出现计算错误,我们的解决思路就是*10,然后把结果/10alert(39.2*10*3/10);这样结果就正确了。在网上找到的解释是:java和JavaScript中计算小数运算时,都会先将十进制的小数换算到对应的二进...原创 2020-05-06 16:12:55 · 1268 阅读 · 0 评论 -
如何让gif图在html网页中只播放一次
如何让gif图在html网页中只播放一次在前端页面开发过程中,有些页面需要放gif图,但是设计给的gif很大记录都是不停循环播放的,如果想在页面中,git图只播放一次,可以通过以下步骤操作:1、在 photoshop 中打开 gif 图2、在菜单栏 点击窗口 ,将时间轴勾上,这样在底部就会出现 时间轴工作区3、在时间轴工作区,将循环播放模式从 永远 改为 一次 或 您需要的次数...原创 2020-04-27 20:50:38 · 7781 阅读 · 0 评论 -
ie浏览器兼容性问题汇总
1、去掉箭头函数 可处理2、ie8不能使用every语句 可处理3、去掉最后一个逗号,ie最后一个不能加逗号。 可处理4、ie8不能使用forEach兼容 可处理5、ie8不能赢媒体查询 可能可处理解决方法:引用<scriptsrc="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></...原创 2020-04-14 17:25:28 · 820 阅读 · 0 评论 -
JS设置cookie、读取cookie、删除cookie
JS设置cookie、读取cookie、删除cookiecookie是网站设计者放置在客户端的小文本文件,一般后台语言使用的比较多,可以实现用户个性化的一些需求。javascript使用 document.cookie 来操作cookie 同一个域名下的页面,共有一个cookie 不同的浏览器分别管理自己的cookie,互不影响 设置方法如下:设置cookie:// 设...原创 2020-04-08 14:26:52 · 305 阅读 · 0 评论 -
Chrome谷歌浏览器下不支持css字体小于12px的解决办法
Chrome谷歌浏览器下不支持css字体小于12px的解决办法先来看下 ie、火狐、谷歌浏览器下各个字体显示情况ie下:火狐下:谷歌下:从上面的图可以很明显看出谷歌下 css设置字体大小为12px及以下时,显示都是一样大小,都是默认12px;解决方法:1、手机端.font{ // 10px / 12px = 0.83 transf...原创 2020-04-07 11:52:28 · 809 阅读 · 0 评论 -
js中的回调函数(callback)
js回调函数(callback)A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.这是js里的英语解释字面上理解下来就是,回调就是一个函数的调用过程。那么就从理解这个调用...原创 2020-04-03 14:12:51 · 1140 阅读 · 0 评论 -
safari中的input、textarea无法输入的问题
原因是这两种表单元素上应用了user-select:none的css属性。一般没人刻意这么做,可能是这样的情况:*{ /*font-family:"PingFang SC";*/ font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB",Arial,sans-serif; -moz-user-...原创 2020-04-02 18:26:00 · 1393 阅读 · 0 评论 -
ie8兼容性ie8缺少SCRIPT1010: 缺少标识符
ie8兼容性ie8缺少SCRIPT1010: 缺少标识符SCRIPT1010: 缺少标识符 ,一般是在IE下会出现这个问题。今天在调试一段js代码时,在chrome,ff下均正常,但是在IE下就是一直这样的提示,出现这个问题的原因主要有以下几点:1、出现了多余的逗号:","2、使用了js中保留的关键词,如: default, delete 等3、ie8下不支持tr...原创 2020-04-02 14:38:51 · 3798 阅读 · 0 评论 -
兼容ie8的Javascript控制文本框只能输入数字[有修改,兼容IE、火狐等浏览器]
Javascript控制文本框只能输入数字[有修改,兼容IE、火狐等浏览器]方法一:<input onkeypress = "return event.keyCode>=48&&event.keyCode<=57||event.keyCode==46" onpaste = "return !clipboardData.getDa...原创 2020-03-31 20:20:19 · 306 阅读 · 0 评论 -
ie8兼容nth-child
ie8兼容nth-childIE8 不支持很多新特效,网站首页图文列表出现错位问题,原因是 IE8 不支持 CSS3 :nth-child() 选择器引起最佳解决方法,通过jqery解决:jQuery:nth-child()选择器的使用方法和 CSS3 的:nth-child()没什么两样,兼容性不必担心。 :nth-child(odd)用于匹配奇数子元素 ...原创 2020-03-30 11:42:34 · 426 阅读 · 0 评论 -
ie8如何兼容媒体查询
ie8如何兼容媒体查询 ie8中媒体查询存在兼容问题, 需要在html dom 和css加载完成后,再引入respond.js<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script><script src="https://cdn.staticfi...原创 2020-03-29 18:58:56 · 453 阅读 · 0 评论 -
IE浏览器下ajax缓存导致数据不更新的解决方法
IE浏览器下ajax缓存导致数据不更新的解决方法 在IE下用Ajax请求某一页面,通常会因为缓存的原因而返回上一次的结果,造成混乱,[即get方式时,获取数据,因发送参数和地址都一致,故IE浏览器会从缓存中取,而不会去请求服务器端,而post方式因为参数的不同,不会产生这个问题]而FF下不会出现这种情况。为了不受缓存影响,可以这样做 解决方法:在AJAX请求的页面后加个随机函...原创 2020-03-29 18:47:43 · 231 阅读 · 0 评论 -
ie8如何通过new Date将字符串转化成日期格式
ie8如何通过new Date将字符串转化成日期格式javaScript ie8 不支持 new Date("2017-07-01"); 只支持new Date("2017/07/01") 所以在web开发中,如果需要兼容ie的话,可以使用new Date("2017/07/01"),将字符串转化成时间格式...原创 2020-03-29 16:39:11 · 761 阅读 · 0 评论 -
IE8如何兼容placeholder解决方案
IE8如何兼容placeholder解决方案ie8和ie9中会出现placeholder不兼容的问题。原因:placeholder是h5的新属性,IE10以前的浏览器(8、9)不支持此属性。解决方法:使用jQuery三方插件 jquery-placeholder使用代码:<head> <script type="text/javas...原创 2020-03-27 14:43:51 · 332 阅读 · 0 评论 -
IE8的如何兼容渐变颜色css3
IE8的如何兼容渐变颜色css3解决方法:body{ width:100%; height:200px; background: -webkit-gradient(linear, 0 0, 0 0, from(#F6F4EF), to(#F1EDE6)); background: -webkit-linear-gradient...原创 2020-03-24 20:09:09 · 587 阅读 · 0 评论 -
IE8关于box-shadow、border-radius不兼容ie8的解决办法
IE8关于box-shadow、border-radius不兼容ie8的解决办法先说 box-shadow:<style>.div{width:500px;height:200px;border:1px solid#eaeaea;behavior:url(pie.htc);-moz-box-shadow:0px 0px 14px 1p...原创 2020-03-24 20:05:21 · 387 阅读 · 0 评论 -
js中获取当前浏览器类型
js中获取当前浏览器类型 在web开发中,经常需要对功能做兼容性处理,需要根据浏览器的类型,做不同的处理,首先需要判断出当前运行的浏览器是什么类型的。解决方法:function myBrowser() { var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 var isOpera = us...原创 2020-03-24 19:55:34 · 790 阅读 · 0 评论 -
ie8中rem 与ie兼容性
ie8中rem 与ie兼容性 web开发中经常会在css中用到rem单位,但是在ie8及ie8以下不支持rem单位。 解决方法:可以使用rem.js这个插件来使其自适用rem.js;要注意将其引入在页脚,也就是css,dom加载完才能执行这个...原创 2020-03-24 19:48:54 · 3307 阅读 · 0 评论 -
如何解决IE8的canvas兼容性问题,不支持getContext方法的问题
如何解决IE8的canvas,不支持getContext方法的问题IE9,IE10已经支持canvas的2d功能了, ie8不支持canvas,如果需要兼容。 可以使用excanvas.js解决该问题解决方法:https://github.com/arv/Explor...因为IE9,IE10已经支持canvas的2d功能了,但是IE8还是不行的,需要用一个js文件虚...原创 2020-03-24 19:43:19 · 2278 阅读 · 0 评论 -
如何让ie8支持foreach
如何让ie8支持foreachie8及ie8以下会存在无法使用foreach的问题,解决方法如下:if ( !Array.prototype.forEach ) { Array.prototype.forEach = function forEach( callback, thisArg ) { var T, k; if ( this ==...原创 2020-03-24 14:48:58 · 621 阅读 · 0 评论 -
CSS中如何设置文字不能被选中
CSS中如何设置文字不能被选中 web网页中常常会有这样的需求,网页中的文字不能被选中复制,防止文字或者文字被粘贴复制可采用如下方法实现该需求:/*设置文字不能被选中 以下为css样式*/-webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; use...原创 2020-03-12 12:57:04 · 887 阅读 · 0 评论 -
html中怎样隐藏滚动框,并实现滚动效果
html中通过设置css熟悉overflow:auto或者overflow-x:scroll或者overflow-y:scroll;但是会出现这样的滚动框,如图所示:解决方法:我先说最优的解决方法,大家都可以选择最优的解决方法去解决开发中遇到的需求问题。然后是解决方法2 .可以作为次要的解决方案。最优解决方案:通过改编滚动框的样式,使滚动框的样式更美观,可通过滚...原创 2020-02-22 23:32:19 · 1144 阅读 · 0 评论 -
html+Canvas+js 实现 图片的剪裁效果
html+Canvas 实现 图片的剪裁效果 开发过程中我们上传图片的时候,有时需要保证图片尺寸的统一,以避免以固定尺寸显示图片时会出现拉伸问题。这是就需要在上传之前对图片进行裁剪后再上传图片。我们裁剪图片将会用到canvas:canvas是HTML5中的一个新元素,这个元素可以通过JavaScript用来绘制图形。例如可以用它来画图、合成图象、做一些动画等。 通...原创 2020-02-17 21:41:39 · 921 阅读 · 0 评论 -
js中如何修改设置blob的fileName
如下修改blob的fileName通过blob上传文件图片时会出现后端解析不了的文件名// Turns out getAsFile will return a blob, not a filevar blob = event.clipboardData.items[0].getAsFile(), form = new FormData(), request = ne...原创 2020-02-17 20:29:26 · 13922 阅读 · 3 评论 -
怎样通过jquery为div设置背景图片
jquery怎样为div设置背景图片 $(....).css("background-image", "url(....)"); $("#scene_pic_wrap_01").css("background-image","url("+url_path+")").css(" background-repeat","no-repeat").css('backg...原创 2020-02-17 14:40:19 · 1465 阅读 · 0 评论 -
Electron如何自定义菜单栏并隐藏调试
Electron如何自定义菜单栏 Electron如果不自定义菜单栏的话,可以弹出代码调试,一般electron发布上线后需要对菜单栏进行隐藏。实现效果如下:实现方法:1.引用Menuconst {app, BrowserWindow,Menu} = require('electron')2.创建Menu实例 var menu ...原创 2019-12-23 14:51:48 · 4815 阅读 · 0 评论 -
Electron中使用JQuery
Electron中使用JQueryElectron默认启用了Node.js的require模块,而jQuery等新版本框架为了支持commondJS标准,当Window中存在require时,会启用模块引入的方式,导致报错 Uncaught ReferenceError: $ is not defined,本文研究了高低版本jQuery引入的正确方式。1. 报错原因Elect...原创 2019-12-16 23:54:26 · 2061 阅读 · 1 评论 -
jquery根据属性查询元素
jquery根据属性查询元素根据属性,找对应的元素1.查找所有含有 id 属性的 div 元素<div> <p>Hello!</p></div><div id="test2"></div> jquery代码:$("div[id]")2.查找所有 name 属性是 newsletter 的 i...原创 2019-12-16 10:44:51 · 194 阅读 · 0 评论 -
js怎么根据自定义属性的值来查找元素
js怎么根据自定义属性的值来查找元素例如有个自定义属性dataid,我现在要定位到dataid为222的标签,js怎么实现?<div dataid="111">a</div><div dataid="222">b</div><div dataid="333">c</div><div dataid="...原创 2019-12-16 10:39:12 · 18893 阅读 · 2 评论 -
Electron 打包安装包 更换系统图标(Windows)
Electron 打包安装包 更换系统图标(Windows)Electron-builder可打包成安装包和.exe可执行文件,可打包安装包如:zip, tar, dmg, pkg...1. 安装npm install electron-builder --save-dev2.环境配置在package.json中添加build"build": { ...原创 2019-12-11 17:39:25 · 7790 阅读 · 2 评论 -
js 比较两个日期的大小
js 比较两个日期的大小function tab(date1,date2){ var oDate1 = new Date(date1); var oDate2 = new Date(date2); if(oDate1.getTime() > oDate2.getTime()){ console.log('第一个大'); } else...原创 2019-12-11 10:36:28 · 292 阅读 · 0 评论 -
electron如何打开调试工具
electron如何打开调试工具JS代码的调试由于Chromium的多进程结构,所以JS代码运行在两种不同的进程环境下,对应的调试方式也分为两种渲染进程下的JS代码调试这个相对简单,我们用代码打开Chromium的开发者工具即可愉快的调试了,代码如下:let win = new BrowserWindow() win.webContents.openDevTools...原创 2019-12-10 15:58:50 · 6388 阅读 · 0 评论 -
使用npm命令,而不用cnpm命令,也可以得到同样的体验
使用npm命令,而不用cnpm命令,也可以得到同样的体验以前大家都知道使用cnpm命令来替代npm,可以大大提升下载各种包的速度。例如:npm install -g cnpm --registry=https://registry.npm.taobao.org// 使用方法cnpm install express但是有时候在运行命令后,npm会自动给出一些提示(例如升级此包),...原创 2019-12-10 10:53:45 · 338 阅读 · 0 评论 -
JS删除数组里的某个元素方法
JS删除数组里的某个元素方法删除数组指定的某个元素js删除数组中某一项或几项的几种方法首先可以给JS的数组对象定义一个函数,用于查找指定的元素在数组中的位置,即索引,代码为:Array.prototype.indexOf = function(val) { for (var i = 0; i < this.length; i++) { if (this[i] == va...原创 2019-11-28 15:22:57 · 646 阅读 · 0 评论 -
JavaScript全局变量的本质及页面共享问题
JavaScript全局变量的本质及页面共享问题全局变量默认为window的成员,window即代表浏览器窗口全局变量均为window的属性函数均为window的方法第一个页面如果包含第二个页面:window.parent.clickTime;如果两个窗口之间不包含,JavaScript是无法跨页面工作的(无法跨页面共享全局变量,因为每个window都是一个独立的个...原创 2019-11-18 22:17:23 · 1952 阅读 · 0 评论 -
jQuery的ajax()、post()方法提交数组,参数[] 问题
jQuery的ajax()、post()方法提交数组,参数[] 问题当用$.ajax()向后台提交参数时,如果参数中数组的话一般在后台会用List,或Integer[] 等数组对象进行接收.比如:$.ajax({type: "POST",url: url,data:{ gender:[0,1] },dataType: "json",a...原创 2019-11-18 21:55:06 · 642 阅读 · 0 评论