js算法
关注
分享
扫一扫
文章平均质量分 75
开心大表哥
高级前端开发进阶版
展开
-
js获取富文本中的第一张图片url正则公式及去除字符串里面的html标签的正则公式
js获取富文本中的第一张图片url正则公式及去除字符串里面的html标签后台发来一个富文本字符串里面可能包含了0、1、2、3…图片标签（img）,我们的任务是获取这个字符串里面第一张图片的url，如果没有图片则放回空var imgUrlFun = function(str){ var data = ''; str.replace(/<img [^&...原创 2018-10-30 13:51:25 · 5554 阅读 · 2 评论 -
前端算法：给定一个整数数组和一个目标值，找出数组中和为目标值的两个数、判断一个整数是否是回文数
<!--给定一个整数数组和一个目标值，找出数组中和为目标值的两个数。你可以假设每个输入只对应一种答案，且同样的元素不能被重复利用。示例：给定 nums = [2, 7, 11, 15], target = 9因为 nums[0] + nums[1] = 2 + 7 = 9所以返回 [0, 1]@link https://leetcode-cn.com/problems/tw...原创 2018-10-24 11:12:55 · 1352 阅读 · 2 评论 -
解析url中的#、&、？的作用和意义
twitter改版，一个显著变化，就是URL加入了"#!"符号。比如，改版前的用户主页网址为http://twitter.com/username改版后，就变成了http://twitter.com/#!/username这是主流网站第一次将"#"大规模用于重要URL中。这表明井号（Hash）的作用正在被重新认识。本文根据HttpWa原创 2018-10-11 15:36:15 · 3726 阅读 · 0 评论 -
js获取url地址中的每一个参数，方便操作url的hash及正则表达式的方式获取在url上参数
js获取url地址中的每一个参数，方便操作url的hash值得收藏<html> <body> <script> //location.search; //可获取浏览器当前访问的url中"?"符后的字串 function parseURL(url) {原创 2018-10-11 15:32:26 · 5920 阅读 · 0 评论 -
正则表达式的高阶使用技巧
零宽断言：零宽断言是正则表达式的一种方法，用于查找在某些内容（但并不包括这些内容）之前或者之后的东西，也就是说他们像\b（匹配一个单词边界，也就是单词和空格间的位置，正则表达式的匹配有两种概念，一种是匹配字符，一种是匹配位置，这里的\b就是匹配位置，例如，“er\b”可以匹配“never”中的“er”，但不能匹配“verb”中的“er”），^（匹配输入字行首），$（匹配输入字行尾）那样用于指定一...原创 2018-09-26 15:30:15 · 1439 阅读 · 0 评论 -
ES6中class的getter和setter在继承中踩坑
在 Class 内部可以使用get和set关键字， 对某个属性设置存值函数和取值函数， 拦截该属性的存取行为。在 Class 内部的get、set用法，看起来比较舒服，而且可以写同名函数了。class MyClass { constructor() {} get prop() { return 'getter'; } set prop(value) { console.log(...原创 2018-09-19 15:19:45 · 6565 阅读 · 1 评论 -
js通过UA判断ios、android、微信、qq、qq浏览器
function isIPhone(){ //判断是否是ios var u = navigator.userAgent; var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端 return isIOS; }var ua = navigator.userAgent.toLowerCase();...原创 2018-09-19 11:15:13 · 4725 阅读 · 0 评论 -
用benchmark测试es6的extends属性的性能
用benchmark测试es6的extends属性的性能新建一个文件叫classExtend.js放以下代码：'use strict';const Benchmark = require('benchmark');const benchmarks = require('beautify-benchmark');const suite = new Benchmark.Suite();...原创 2018-08-27 22:26:43 · 496 阅读 · 1 评论 -
占位图和图片懒加载项目实战详解
占位图（兜底图）：真实图片太大还没有加载完之前先用一张占位图表示这个位置将来会有图片或者说明这个位置是有图片的但是不知道什么原因真正的图片没有加载出来用户只能看到这张占位图；什么是图片懒加载：懒加载也就是延迟加载，当访问一个页面的时候，先把img元素渲染出来，但是不给它真正的src地址，只有当用户需要看到真正图片的时候，才设置图片正真的路径，让图片显示出来。为什么要使用懒加...原创 2018-08-23 14:40:37 · 7547 阅读 · 5 评论 -
活用clone和trigger函数，点击按钮原有事件不触发，之后再触发原有事件
活用clone和trigger函数，点击按钮原有事件不触发，之后再触发原有事件 需求： 网站开发完毕了，然后产品说要在原来的’确认按钮’点击后加一个’弹窗’提醒用户一些注意事项，在用户点击弹窗里面的’同意按钮’后再执行原来’确认按钮’ 里面绑定的事件。需求看起来很简单，但是有一个要求不能在原来代码上改，只能引入一个js文件和一个css文件。 思路： 将’确认按钮’clone出来，然后将它...原创 2018-08-23 10:34:13 · 1332 阅读 · 2 评论 -
Javascript闭包由浅入深题目
闭包就是能够读取其他函数内部变量的函数两个最大用处 一个是前面提到的可以读取函数内部的变量； 一个就是让这些变量的值始终保持在内存中。1、变量作用域 要理解闭包，首先要理解javascript的特殊的变量作用域。 变量的作用域无非就两种：全局变量和局部变量。 javascript语言的特别之处就在于：函数内部可以直接读取全局变量，但是在函数外部无法读取函数内部的局部变量。 注意...原创 2018-05-07 00:28:06 · 1571 阅读 · 1 评论 -
循环调用innerHTML属性时进行性能优化1000多倍
innerHTML是一个JavaScript访问dom的API,由于js和dom时两个相互独立的功能只要通过接口彼此连接，就会产生消耗。 所以访问dom元素的有代价的，修改元素则更为昂贵，因为他会导致浏览器重新计算页面的几何变化。 最坏的情况是在循环中访问或修改元素，尤其是对HTML元素集合循环操作。 这是下面两次写法循环15000次在谷歌浏览器上的差距，你没有看错，这两种写法的差距能到达1...原创 2018-04-30 16:35:23 · 6416 阅读 · 3 评论 -
js将带有日期格式的数组对象按时间降序重新排列，最后打印数组对象的日期
需求：后台将一个带有日期格式（不是时间戳）的数组对象给到前端，前端打印这个数组对象的日期时需要按时间降序排列思路：1.先将对象中的日期字段变成时间戳，然后通过sort()来排序，接着将对象中的时间戳变成日期； 2.先给对象增加一个字段publishTimeNew，用来保存时间戳；然后通过sort()来排序publishTimeNew虽然第二种思路多增加了一个publishTimeNew字段占...原创 2018-10-30 18:01:10 · 10480 阅读 · 3 评论 -
javascript一道综合了解析数组、数组去重和数组排序的前端工程师进阶面试题
已知道如下数组： var arr = [[1, 2, 2], [3, 4, 5, 5], [6, 7, 8, 9, [11, 12, [12, 13, [14]],15]], 10]; 编写一个程序将数组扁平化并去除其中重复部分数据，最终得到一个升序且不重复的数组： var res= [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15] 答案：<scr...原创 2018-04-08 15:26:07 · 741 阅读 · 4 评论 -
javascript数组对象for循环中突然出现闭包的解决方案
1.代码目的是：将后台返回的data数组对象通过setData函数写到全局数组itemArr中。但是下面的写法出错了！<script>var data = [ {name:'小红',age:'18'}, {name:'小名',age:'19'}, {name:'小白',age:'20'}, ...原创 2018-04-08 11:40:07 · 5123 阅读 · 2 评论 -
仿响应式html:JS来判断页面是在手机端还是在PC端打开的方法
我们想要的效果是pc文件和mobile文件统一入口，适配不同的设备。 先看看项目的目录： 在index.html里面配置js控制选择那一个文件夹下的文件就可以了。 我们要利用：Navigator 对象，Navigator 对象包含有关浏览器的信息。 index.html很简单，直接上码吧：<!DOCTYPE html><html> <head> <meta ch原创 2017-12-08 15:50:06 · 26520 阅读 · 18 评论 -
两道前端面试题目：1.变量作用域，2.利用hash将数组去重
1.变量作用域：function User(){ this.name="Vicfeel"; var age=23; this.sayAge=function(){ console.log('my age id '+age); }}var user = new User();console.log('user.name:'+user.name);原创 2017-11-29 15:22:52 · 12248 阅读 · 1 评论 -
h5腾讯提供的边栏垂直滚动导航案例
边栏垂直滚动导航使用说明自动滚动到对应ID内容板块； 自动添加当前导航对应的样式； 可定义随意拖动。效果： 参考源链接：http://tgideas.qq.com/webplat/info/news_version3/804/25810/25811/25813/25816/m16274/201611/522586.shtml原创 2017-10-16 17:19:41 · 10921 阅读 · 7 评论 -
js控制一个字符串中某个字体的颜色和拼音首字母转汉字
js控制一个字符串中某个字体的颜色和拼音首字母转汉字/* *方法说明: *将用户输入的关键字与后台返回的字符串进行匹配，匹配成功的字符加上： '<span></span>'， *支持拼音首字母转汉字。 * @method addSpan * @param {string} k 用户输入的关键字：w 或者 我 {string} question 后台返回的问题字符串：我国第一部系统原创 2017-10-30 17:45:06 · 12258 阅读 · 0 评论 -
js防止安卓手机软键盘弹出挤压页面导致变形的方法
h5防止安卓手机软键盘弹出挤压页面导致变形的方法 先看看问题： 1.原来是这样的： 2.在苹果手机里面是正常的： 3.到了安卓就是这样： 4.原因就是在安卓中被软键盘顶上来了，而苹果的软键盘是覆盖的（分层） 5.后来用的解决方法是，把当前页面的body固定好，即在当然页面加上这段js：$('body').height($('body')[0].clientHeight);6.原创 2017-10-12 14:25:07 · 25735 阅读 · 3 评论 -
h5、tab图片滚动原生js代码
h5、tab图片滚动原生js代码： 1.先看看案例图片； 2.功能：a.点击tab中的款式，图片可以更换.b点击左右按钮图片可以更换，tab中的款式选中对应的。 话不多说，直接上码： html<div id="product-id"> <ul id="style"> <li class="active">大屏单柜</li> <li>A款</li原创 2017-09-29 17:04:00 · 1937 阅读 · 1 评论 -
ajax请求时提醒参数为空的解决办法
1.ajax请求时提醒参数为空的解决办法： 我们要把js对象用stringify转成json,然后再加上：contentType: “application/json” var _phone = $("#phone").val(); var timestamp = (new Date()).valueOf(); var x= {原创 2017-09-29 16:51:30 · 31122 阅读 · 0 评论 -
h5、js最详细的正则检验手机号码
h5、js最详细的正则检验手机号码 1.html部分代码<div id="input-div"><input type="text" placeholder="请输入您的姓名" id="username" required="" maxlength="10"/><input type="text" placeholder="请输入您的电话号码" id="phone" required="" m原创 2017-09-29 10:55:10 · 9333 阅读 · 2 评论 -
js获取当前日期，并且转化为时间格式“yyyy-MM-dd HH:MM:SS”
js获取当前日期，并且转化为时间格式“yyyy-MM-dd HH:MM:SS”function getNowFormatDate() { var date = new Date(); var seperator1 = "/"; var seperator2 = ":"; var month = date.getMonth() + 1; var strDate原创 2017-08-29 20:51:22 · 19901 阅读 · 0 评论 -
h5大转盘，圆盘抽奖，正方形抽奖
h5大转盘，圆盘抽奖，正方形抽奖等是我们搞活动的时候用的很多的需求，那么如何才能拥有一个好的插件的。以下我来介绍一款：原生 JavaScript 抽奖组件，支持移动端适配，无框架依赖，抵制 FLASH ！ 源码到这个网址拿：http://game.gtimg.cn/images/js/delottery/index.html 1. 2. 3. 以下是一个案例：原创 2017-09-23 12:40:29 · 5043 阅读 · 1 评论 -
js简单删除数组中任意元素
////删除数组中任意元素 ///arr需要去除元素的数组 ///str需要去除的内容 function spliceArr(arr,str){ for (var i = 0; i < arr.length; i++) { if (arr[i] == str) { arr.splice(i, 1); } } return arr; }原创 2017-09-06 20:44:06 · 553 阅读 · 1 评论 -
所有网站都通用的自定义弹出框alert
A.所有网站都通用的自定义弹出框.A </body><script> var Alert = function(data){ //没有数据则返回 if(!data){ return; } //设置内容 th原创 2017-08-12 15:58:56 · 22507 阅读 · 0 评论 -
设计模式：javascript原型式继承
道格拉斯丶克罗克福德有一个观点是：借助原型prototype可以根据已有的对象创建一个新的对象，同时不必创建新的自定义对象类型。代码如下：//原型式继承function inheritObject(o){ //声明一个过渡函数对象 function F(){} //过渡对象的原型继承父对象 F.prototype = o; //返回过渡对象的一个实原创 2017-08-05 15:40:47 · 361 阅读 · 0 评论 -
js爬虫拿到的字符串数据转化成数组再转化成json对象
js爬虫拿到的字符串数据转化成数组再转化成json对象 当我们通过js获取一些jsonp返回的数据时，这些数据的结构会比较特殊，所以需要通过处理才能获取到数据中想要的内容。 假设我们现在获取到了这样一个字符串数据：backdata([{“id”:1,”name”:”小明”},{“id”:1,”name”:”小明”},{“id”:1,”name”:”小明”}])。 接下来就是获取字符串里面的特定原创 2017-11-01 11:42:32 · 19843 阅读 · 0 评论 -
简单轻松地理解js编译和执行顺序
javascript是一段一段执行的，以script标签来分割，执行每一段之前，都有一个“预编译”， 预编译干的活有两：1.声明所有var变量（初始为undefined），2.解析定义式函数语句。 有个关于 “window作用域下，a = 1和var a = 1” 的区别的很经典：a = 1相当于window.a = 1，是动态地为window添加一个成员； var a = 1是在当前作...原创 2018-02-23 16:05:41 · 2005 阅读 · 0 评论 -
es6 promise对象回调处理详解
在JavaScript的世界中，所有代码都是单线程执行的。 由于这个“缺陷”，导致JavaScript的所有网络操作，浏览器事件，都必须是异步执行。 通常我们用得较多的是setTimeout来做一个回调，但本文说得是Promise这个高大尚的es6新对象, 所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。从语法上说，Promise 是一个...原创 2018-03-09 10:48:24 · 3265 阅读 · 0 评论 -
h5锁屏提醒-锁横屏和锁竖屏
移动端开发，我们一般是只做一套适配，但是拿手机来说，它又分横屏和竖屏；这两种屏幕要求的适配是完全不一样的。当我们只做了其他一种，不想做另外一种的话，屏幕使用提示就很重要了。 比如我们只做了竖屏的适配，不想让用户看到横屏的情况： 比如我们只做了横屏的适配，不想让用户看到竖屏的情况： 上面两种提醒是用了js控制的（图片用了base64的，看起来代码有点长）： 第一种：//竖屏处理...原创 2018-02-12 11:33:17 · 7356 阅读 · 1 评论 -
h5 audio 背景音乐播放开关控制
现在的活动h5基本都会有bgm的需求，下面提供一个通用的做法。 上面是开关的按钮，页面刚加载进来的时候，音乐是自动播放的。点击开关按钮可以控制音乐的播放和暂停。 产品：需求很简单，怎么实现我不管！ 开发：好！那我给你来个五彩斑斓的黑 html:<!--背景音乐--><audio id="music" loop="loop" style="display:...原创 2018-02-12 11:11:26 · 8214 阅读 · 1 评论 -
基于zepto的motion库-移动端页面无缝循环滑动效果
基于zepto的motion库-移动端页面无缝循环滑动效果 案例地址<!DOCTYPE HTML><head><meta charset="utf-8"><meta name="author" content="Tencent-TGideas"><meta name="format-detecti原创 2018-02-12 10:57:16 · 1411 阅读 · 1 评论 -
纯js事件委托模式，委托父元素
1.点击前 2.点击后 内容代码：html> head> meta charset="UTF-8"> title>title> head> body> div id="article"> p>文字在这里p> div> script>原创 2018-01-20 21:27:11 · 1916 阅读 · 0 评论 -
js统计元素元素路径，获取某元素相对指定父元素得路径
js获取某元素相对指定父元素得路径，例如： 想看html文档树：html> head> meta charset="UTF-8"> title>title> head> body> div> ul> li>span id="span1">span>li>原创 2018-01-20 14:19:53 · 1508 阅读 · 0 评论 -
jquery拉拽div
代码提醒：需要导入jquery库 *{padding: 0;margin: 0;}div{width: 110px;height: 120px;background: pink;cursor: pointer;position: absolute;left: 0;top: 0;}原创 2015-03-06 09:21:15 · 586 阅读 · 0 评论 -
仿安卓的手机网页版toast
1.先写好toast的js代码：/** * 模仿android里面的Toast效果，主要是用于在不打断程序正常执行的情况下显示提示数据 * @param config * @return */ var Toast = function(config){ this.context = config.context==null?$('body'):con原创 2015-04-14 09:29:27 · 1156 阅读 · 0 评论 -
html5上传图片立即看到效果和图片替换
1.先写一个和<img id="headImg" src="../img/assets/Oval 2.png"/><input type="file" id="fileInput" class="fileInput img-circle" />2.通过Css,控制这两个元素的位置，使他们大小相同，位置相同，达到重合的状态。读者可以更加自己的需要调整位置。 #headImg{ width:原创 2017-07-07 13:12:34 · 2059 阅读 · 4 评论 -
一个简单的js快速排序算法
var test2 = [21,2,11,4,5]; var quickSort = function(arr) { if (arr.length <= 1) { return arr; } var pivotIndex = Math.floor(arr.length / 2); var pivot = arr.splice(pivotIndex, 1)[0]; v...原创 2017-08-09 13:07:37 · 4177 阅读 · 1 评论