Pan Fengshan的博客

一、问题场景有些场景下，我们需要在小程序自定义组件中获取某些元素的高度，代码如下：ready: function() { wx.createSelectorQuery().select('.search-content').boundingClientRect(rect=>{ console.log(rect.height) }).exec();}...

有的时候服务端数据库是GBK格式，我们存过去的汉字，有些会被转义，比如 龚 ==》䶮有些场景我们需要显示正确转义后的文本，可以进行如下处理：/** * 解析段落的unicode字符，如 䶮 */function decodeUnicode(str) { //替换 & 为 & let ret = s...

一、正则替换function convertNumToThousand(num){ return num.toString().replace(/(\d)(?=(\d{3})+\.)/g,'$1,');}

Async/await写在前面渣渣新人的首篇外文文章翻译！！存在错误可能会很多，如有错误，烦请各位大大指正出来，感谢！本篇为翻译！本篇为翻译！本篇为翻译！原文文章地址：https://javascript.info/async-awaitAsync/await有一种特殊的语法可以更舒适地与promise协同工作，它叫做async/await，它是非常的容易理解和使用。...

文章目录数字金额转大写金额数字金额转大写金额 function digitToUppercase(num){ let fraction = ['角', '分']; let digit = ['零','壹','贰','叁','肆','伍','陆','柒','捌','玖']; let unit = [['元', '万', '亿'],['', '拾',...

文章目录获取一段字符串中的最长对称子串获取一段字符串中的最长对称子串function getSubStr(str){ let result = '', subStrLen = 2, subArr = [], i=0; //对称子串长度肯定是偶数位 //获取字符串的所有偶数位子串集合，放到数组中 while(i<str.leng...

什么是BFC在一个Web页面的CSS渲染中，块级格式化上下文(Block Fromatting Context)是按照块级盒子布局的。W3C对BFC的定义如下：浮动元素和绝对定位元素，非块级盒子的块级容器（例如 inline-blocks, table-cells, 和 table-captions），以及overflow值不为“visiable”的块级盒子，都会为他们的内容创建新的B...

问题描述：页面输入框聚焦时，网页被键盘推上去了，但是失去焦点时页面停在原地没有下来，在微信浏览器及搜狗浏览器都有这个问题，苹果自带的Safari浏览器没有这个问题问题如下图解决办法：在输入框失去焦点的时候，将scrollTop设为0即可document.body.scrollTop = 0;...

实现Promise功能代码如下：var Promise = (function() { function Promise() { this.callbacks = []; } Promise.prototype = { constructor: Promise, resolve: function(result) { this.complete('resolve', ...

判断浏览器类型及版本function getBroswer(){ var os = navigator.platform; var userAgent = navigator.userAgent; var info = ""; var tempArray = ""; //判断浏览器版本 var isOpera = userAgent.indexOf("Opera") &...

寄生组合式继承定义：所谓寄生组合式继承，即通过借用构造函数来继承属性，通过原型链的混成形式来继承方法。其背后的基本思路是：不必为了指定子类型的原型而调用超类型的构造函数，我们所需要的无非就是超类型原型的一个副本而已。本质上，就是使用寄生式继承来继承超类型的原型，然后再将结果指定给子类型的原型。（引自《JavaScript高级程序设计》）1.定义父类型function Person(name)...

一、 闭包的定义能访问其他函数内变量的函数，这种结构就是闭包二、闭包的用途1.读取函数内部的变量2.让这些变量的值始终保持在内存中（结果缓存）3.创建匿名自执行函数（避免全局变量的污染）三、闭包的弊端1.使用不当会很容易造成内存泄露2.常驻内存，增加内存使用量四、实际应用接下来举一些实际工作中用到的闭包示例1.自定义Alert弹框，该弹框只会被new一次，用的就是闭包mod...

背景：在项目碰到一个需求，产品要求将提示文字同事用语音播放出来实现：此处用到了百度提供的一个文字转语音接口代码：function playAudio(text){ const url = "http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&text=" + encodeURI(text); ...

注意事项1.如果是基本数据类型，直接返回2.如果是 RegExp 或者 Date 类型，返回对应类型3.如果是复杂数据类型，递归。4.考虑循环引用的问题代码实现//WeakMap解决循环引用问题function deepClone(source,hash=new WeakMap()){ if(source instanceof RegExp) return new RegEx...

前言在做项目过程中，经常碰到需要进行计算的地方，必须单价，重量，高度等运算，有时会出现精度失真或者小数位很多的问题示例解决思路通过将运算的两个数放大相应的倍数，将其变为整数进行运算，然后将结果再除以放大的倍数即可。具体实现1.加法function numAdd(num1: number, num2: number): number{ let baseNum: number,...

一、函数防抖定义当持续触发事件时，一定时间段内没有再触发事件，事件处理函数才会执行一次，如果设定的时间到来之前，又一次触发了事件，就重新开始延时应用场景在实现根据用户输入实时搜索时，我们可以给搜索方法加个防抖，即在用户持续输入过程中，防抖函数起作用，不会向后台频繁发请求，只有用户中断输入（关键词输入完毕）再进行搜索代码实现function debounce(func,time=17,o...

你遇到过性能很差的网页吗？这种网页响应非常缓慢，占用大量的CPU和内存，浏览起来常常有卡顿，页面的动画效果也不流畅。你会有什么反应？我猜想，大多数用户会关闭这个页面，改为访问其他网站。作为一个开发者，肯定不愿意看到这种情况，那么怎样才能提高性能呢？本文将详细介绍性能问题的出现原因，以及解决方法。一、网页生成的过程要理解网页性能为什么不好，就要了解网页是怎么生成的。网...

常用跳转代码 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 2...

由于在做一个直播平台项目，要给我们的项目加上一个弹幕功能，在网上也找到了可以直接用的插件。但毕竟不是自己写的，还是想自己来实现一个简单的弹幕方法，下面来介绍一下我的弹幕，超简单的喔！1、首先在HTML里定义一个现实弹幕的容器，id为danmu。2、在js文件中，定义一个弹幕方法，具体代码如下function danmu(text){ var $p=$(''+text+'')

用HTML5的canvas实现五子棋小游戏，体验人机大战的感觉

通过上一篇的代码，我们已经实现了五子棋这个游戏，并且可以开始人机大战了。不过js的代码部分还是新手写法，扩展性也不强，也不容易修改，假如我们把棋盘大小改一下要修改很多地方，要加入别的功能也会很困难，所以后续又改成了面向对象的写法，想必这样做的有点我不用再赘述了，直接上代码：function chess(){ var self=this; this.canvas=docume

由于看到每个电商网站的首页基本上都有轮播广告，所以我也写了一个简单的轮播广告效果，记录一下，以后用到的话可以直接使用了。本篇主要介绍如何在我们的网页中快速实现轮播效果，js的原理部分在续篇中详细讲解。一、首先在HTML中想要放轮播的地方加入以下代码：id="slider"> id="imgs"> id="indexs">二、在样式文件中加入以下样式：

今天给大家带来的是LightBox图片画廊插件的实现方法，用jQuery制作出一款简洁、漂亮的图片画廊，下面我们先看一下实现的效果：这是我们最终实现的效果图，点击小图片之后弹出的对应的大图，中间有过渡动画，效果非常好看。下面我们来看一下LightBox插件的实现方法一、首先我们要引入jQuery，我这里用的是2.1.1版本的src="js/jquery-2.1.1.js">

快速理解RequireJs

网站浏览器崩溃原因分析

Function与Object的那些不清不楚的事

大白话讲解Promise

令你瞠目结舌的 JavaScript 代码技巧

鄙人来本公司前未用过ionic框架，但由于ionic是基于angularjs封装的，正好我用过angularjs，很荣幸的面试就过了，然后通过该网站http://www.ionic.wang（后面简称网站i）边学ionic边做项目。　　ionic刚踩过的坑--$ionicGesture！现总结下$ionicGesture,希望对用到该框架的童鞋有所帮助！　　网站i对$ionicGe

JavaScript专题系列20篇正式完结！

JavaScript深入系列15篇正式完结！

vue + typescript 新项目起手式我知道你们早就想用上 vue + ts 强类型了还有后续 vue + typescript 进阶篇安装vue-cli安装ts依赖配置 webpack添加 tsconfig.json添加 tslint.json让 ts 识别 .vue改造 .vue文件什么是typescriptTypeScript 是 JavaScript 的强类型版本。然后在编译期去掉...

试想一个场景，你正在某个网站上上传几张照片，分别有几个上传的地方，如果上一张没有传完，你就不能点击下一个上传按钮，这样的等待体验是不是很糟糕呢。再试想一个场景，当你在淘宝购物的时候，如果点击了某个提交按钮，整个页面都跟着刷新，这样的感觉想必也不是好。如何解决这些问题呢？没错，接下来就请出我们今天的主角，Ajax！什么是Ajax呢，Ajax是Asynchronous Javascript And