- 博客(28)
- 收藏
- 关注
原创 web端实时获取服务器数据的三种方法
web端实时获取服务器数据的三种方法在web端,想要实时获取服务端的消息,一般有3种方法1、接口轮询:通过客户端循环发送接口获取数据function send(){ $.ajax({ url: "/test", success: function(res){ //处理res } })}setInterval(function(){ send()}, 2000)分析:每两秒钟发一次
2020-12-24 14:36:27
9334
原创 js纯前端压缩图片
js纯前端压缩<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>压缩图片</title></head><body> <inp
2020-11-12 16:52:00
492
1
原创 css-项目中的解决方案
css-项目中的解决方案css是页面的样式控制,但我们在使用中,常常会出现自己写的css样式给覆盖了,这是因为css的样式优先级是根据css的权重来的权重排行:!important(最高级) > 行内样式(1000) > id(100) > class(10) > element(1)计算规则:除!important 外,权重是父级到子级的权重相加,最大权重的css样式就覆盖较小权重的css样式举例:<style> #box p{color:
2020-11-10 16:21:38
771
原创 js设计模式--策略模式
js设计模式--策略模式设计模式的宗旨: 把不变的和变化的分开。策略模式:定义一系列的算法,然后把它们一个个封装起来,并且使它们可以相互替换。分析:根据设计模式的宗旨,这里是分成两个部分,一个部分是定义好的算法,这个是属于变化的部分,一部分属于调用算法部分,这部分属于不变部分以计算员工工资为例子:员工的工资分成基本工资+绩效工资 绩效工资 = 基本工资 *等级参数 等级有A,B,C对应的等级参数是 0.4, 0.3, 0.2我们先来定义好算法部分:const strateg.
2020-11-06 14:00:00
164
原创 js new运算符到底干了什么?
js new运算符到底干了什么?在JavaScript中,想要创建一个对象,往往用到new,但是new到底做了什么呢,今天我们来讨论一下new运算符:创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例在MDN中描述:创建一个空的简单的JavaScript对象(即{}) 链接该对象(设置该对象的constructor)到另一个对象 将步骤1新创建的对象作为this的上下文 如果该函数没有返回对象,则返回this这里有 对象objA:是一个空的JavaScript对象,对象o
2020-10-27 18:21:51
285
原创 前端入门知识(二)
前端入门知识(二)前端开发流程在分离之后的前端开发,首先要解决两个问题:页面预览问题(pc端和手机端预览)和 接口跨域问题一、页面预览问题直接用浏览器打开.html文档,这个url的路径类似于file:///D:/myDemo/backbonejs/index.html,这个属于绝对路径。代码如下 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> .
2020-10-27 11:19:40
296
2
原创 js 设计模式 - 单例模式
javascript 设计模式- 单例模式定义:保证一个类仅有一个实例,并提供一个访问它的全局访问点适用场景:例如:线程池、全局缓存、浏览器中的window对象,登陆弹框等等例子:登陆弹框代码1:<body> <button id="loginBtn">登陆</button> <script> var loginLayer = (function() { var div = document.createEle
2020-10-27 00:09:25
131
原创 前端入门知识(一)
前端入门知识(一)前端的发展历程 总的概括一下前端的历史:做为后端的一部分----从后端分离出来----自己写前端和后端 对应的前端程序员的历史:切图仔----前端工程师----全栈工程师什么是前端前端:针对浏览器的开发,代码在浏览器中运行 后端:针对服务器的开发,代码在服务器运行前后端不分的时代 互联网发展的早期,前后端开发是一体的,前端的代码是有后端人员进行开发的,也是做为后端代码的一部分 大致的开发流程是这样的浏览器输入网址,...
2020-10-26 10:17:39
2001
3
原创 h5页面兼容性处理
1.viewport-fit=cover,兼容iponeX,防止页面底部留空: <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=0,viewport-fit=cover" />2.下面是防止页面是数字被页面当成手机的拨号号码...
2018-12-25 15:15:46
877
原创 移动端h5页面,Object.assign()不兼容的解决方法
在一些手机浏览器上,页面Object.assign是没有的,这导致该方法失效。解决的方法: 检测Object.assign方法是否存在,不存在则重写, 重写的方法就是把https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/assign里面的polyf...
2018-12-25 14:56:51
2125
原创 weinre使用
1.介绍 weinre是远程调试工具,适合移动端web调试2.安装 npm instanll -g weinre3.运行 weinre --httpPort 8081 --boundHost -all- httpPort 调试服务器运行的端口,默认8080 boundHost 调试服务器绑定的ip地址或域名,默认localhost4....
2018-12-25 14:44:16
434
原创 node中的setTimeout,setInterval,promise.then和process.nextTick()的执行顺序。
1.关于javaScript的单线程: 应用场景决定了javascript的单线程的特性,假如javascript是多线程,同时进行:一个线程对某一个dom进行添加属性操作,另一个线程对该线程进行删除操作,那么浏览器该听哪一个。这就决定javascript必须是单线程。 web worker:是一个多线程。它出现的目的是当浏览器有大量密集的计算时候或者响应时...
2018-12-18 12:00:15
3474
3
原创 js 对固定的计算,做缓存处理,比如计算乘积;
对固定的计算,做缓存处理,比如计算乘积; var mult = (function() {var cache = {};var calculate = function() {var a = 1;for(var i = 0, l = arguments.length; i<l;i++){a = a * arguments[i];}return a;}...
2018-11-27 00:19:15
257
原创 for循环定义同类型的多个函数
用for循环来定义多个类型相同的函数依次定义了Type.isString,Type.isArray,Type.isNumber函数 var Type = {}; for(var i = 0, type; type = ['String','Array','Number'][i++];){(function(type){Type['is'+type] = function...
2018-11-26 23:51:25
834
原创 Function.prototype.bind的实现
Function.prototype.bind = function() { var self = this, content = [].shift.call( arguments ), //需要绑定的this上下文 args = [].slice.call( arguments ); //剩余的参数转成数组 return fu...
2018-11-26 23:08:36
234
原创 js的深度复制
1、利用JSON.stringify和JSON.parse;这种方法只能适用json格式, var a = {b:{c:1}}; var d = JSON.parse(JSON.stringify(a)); console.log(d); //{b:{c:1}} a.b.c = 2; console....
2018-10-16 11:13:40
163
原创 判断js对象为null或者属性为空
利用for in对对象进行遍历,如果可以遍历则不为空1、包括原型链的属性function isEmpty(obj){ for(var key in obj){ return false; } return true}2、只对对象本身判断,不包括原型链function isEmpty(obj){ fo...
2018-10-15 14:19:59
8346
1
原创 类数组转数组的方法
有时候我们需要对类数组处理,比如最常见的是函数的参数arguments,document.getElementsByTagName()类数组的特点: 1、拥有length属性,其他属性(索引)为非负整数。 2、不具有数组所具有的方法例如:var arguments = {length:2,0:'a',1:'b'};方法一:循环类数组,并把子项添加到一...
2018-10-11 19:04:35
409
原创 通过Set数据结构给数组去重
var arr = [1,2,2,3,3,4,];方法1:利用Set给数组去重,在通过解构把Set结构转回数组[...new Set(arr)] //[1,2,3,4]方法2:利用Set给数组去重,在通过Array.from(),把Set结构转成数组Array.from(new Set(arr)) ...
2018-09-13 11:51:39
746
原创 js事件委托
事件委托:利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件。其中包括click,mousedown,mouseup,keydown,keyup,keypress,以click为例:<ul id="myLinks"> <li id="goSomewhere">Go somewhere</li> <li id="doSo...
2018-08-30 17:58:42
144
原创 js获取页面上元素的位置的通用方法
var div = document.getElementById('myDiv');EventUtil.addHandler(div,"click",function(event){ event = event || window.event; var pageX = event.pageX, pageY = event.pageY; ...
2018-08-29 21:46:26
1248
原创 跨浏览器事件处理程序
var EventUtil = { addHandler: function(element, type, handler){ if (element.addEventListener){ element.addEventListener(type, handler, false); } else if (element.atta...
2018-08-27 22:49:44
214
转载 防止自己的网站给别人iframe使用
主要在网页头部加上下面的代码,就可以防止网页被嵌入框架iframe中。<script type="text/javascript"> if (window != top) //判断当前的window对象是否top对象 top.location.href = window.location.href //如果不是,将top对象的网站自动导向被嵌入网页的...
2018-08-21 14:48:29
782
原创 js实现递归,尾递归(递归优化),防止栈溢出
一、一版的递归实现 n!,比如 5!= 5 * 4 * 3 * 2 *1 function fact(n) { if(n == 1) { return 1; }else{ return n * fact(n-1) } ...
2018-08-20 15:53:09
3742
原创 js实现斐波那契数列 0 1 1 2 3 5 8 13 21 34 。。。
斐波那契数列就是著名的兔子生兔子问题,后面一个数等于前两个数的和//max大于等于2的整数function fib(max) { var t,a=0,b=1,arr = [0,1]; while (arr.length < max) { [a,b] = [b,a+b]; //es6的解构 arr.push(b...
2018-08-20 15:25:48
4974
原创 js中字符串转数字的方法
一、parseInt()函数和parseFloat()函数 parseInt('123') === 123; parseFloat('123.01') === 123.01;二、Number()强制转换 Number('123.01') === 123.01;三、js弱转换 +'123.01' === 123.01;...
2018-08-20 13:36:43
4910
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人