JavaScript 高级程序设计
前端小白的江湖路
这个作者很懒,什么都没留下…
展开
-
JS遍历对象
function handleData(data_obj){ for(var prop in data_obj) { console.log(prop); var $div=$(""); $div.text(data_obj[prop]); $("#content").append($div); }}原创 2016-08-15 15:05:34 · 344 阅读 · 0 评论 -
多维数组按照指定项排序
多维数组按指定项迭代排序比如[[[1, 2], [2, 10],[2, 0], ,[1, 4], [4, 3]]这样的二维数组如果先按第一项排序,就得到[[1,2],[1,4],[2,10],[2,0],[4,3]], 然后再按照第二项排序。或者先按照第二项,再按照第一项也是一样。function sortArray(arr, index) { /* @arr: 待排序的多原创 2017-09-14 19:53:17 · 486 阅读 · 0 评论 -
随机数生成
function getRandom(cnt, min, max) { /* @cnt: 生成随机数的个数 @min: 开始数 @max: 结束数 */ var arr = []; var temp; for(var i=0; i<cnt; ++i) { //temp = Math.round(min+(max-min)*Math.random()); //[a, b原创 2017-09-15 14:51:00 · 367 阅读 · 0 评论 -
密码框自动切换焦点
主要功能描述如下:1)输入当前一个数字后,焦点自动跳到一个input输入框2)按退格键,如果当前内容是空的,则跳到上一个input输入框,并清空内容非空的话,就清空内容即可样式神马的,就自己改改就好了。实际使用的时候,input type="password" 较为方便一点html filter input Please input原创 2017-09-07 19:57:51 · 721 阅读 · 0 评论 -
字符串一些常见的练习操作
1.寻找所有子串的位置function substrPosition (str, substr) { /* find all the substr position */ var position_arr = []; var index = str.indexOf(substr); while(index != -1) { position_arr.push(index);原创 2017-09-15 17:45:53 · 1572 阅读 · 0 评论 -
多维数组深拷贝与一维化
1.多维数组深拷贝对于一维数组,直接用slice和concat就可以进行copy多维数组的话,写个递归逐个赋值即可/* 数组的深拷贝*/function arrayDeepen(arr) { /* @arr: 要进行深拷贝的数组 */ var temp_arr = []; for(var i=0; i<arr.length; ++i) { if(Array.isA原创 2017-09-12 17:35:33 · 537 阅读 · 0 评论 -
You might not need jQuery
你可能不需要jQuery转载 2017-09-01 14:26:50 · 247 阅读 · 0 评论 -
笔记:SEO在网站制作中的应用
本文为一篇慕课网SEO学习笔记。原视频地址: SEO在网站制作中的应用1.分类白帽SEO与黑帽SEO2.优化方法 1)内容上的SEO对网站的标题、关键字、描述进行精心设计。及网站内容优化、加设 Robot.txt文件。网站地图、增加外链引用。2)网站结构布局优化 目录层次结构小(不要超过三层)控制首页的链接数量面包屑导航(告知在网页中所处的位置,原创 2017-10-06 19:19:10 · 371 阅读 · 0 评论 -
js 生成随机数组或者叫做洗牌算法
我们假设有一个颜色数组是这样的var arr = ["red", "green", "blue", "yellow", "brown", "violet"]。如果将其顺序打乱,生成一个随机的数组。这该如何做呢?1.一种直观的做法就是,随机生成一个[0, arr.lebgth-1] 区间的随机数然后弹出(splice)一个数据,继续生成.逐渐迭代即可 。这种方法最耗时func原创 2017-09-18 19:24:23 · 1704 阅读 · 0 评论 -
vscode使用习惯配置
{ "window.zoomLevel": 1, //设置字体大小 "files.autoSave": "onFocusChange", //自动保存,当编辑框失去焦点 "editor.matchBrackets": false // 去除html标签左右的方框}原创 2017-11-04 11:22:45 · 527 阅读 · 0 评论 -
Math.random() 生成指定范围随机整数的思考
Math.random() 生成的是[0, 1)之间的伪随机数。注意左闭右开。1.第一种范围,也是最常用的用法,[min, max],均是闭区间。为了方便我们举两个数, [2, 8]之间0____1_____2_____3____4____5____6___7____8_____9____101)如果我们使用Math.floor来近似的话,可以像这样看,就以2为例,2到3区间的数都属于2,例...原创 2018-04-01 16:34:27 · 4565 阅读 · 0 评论 -
交互动画网站学习
1.loading animations2.user interface animations3.animation collection原创 2018-06-11 17:25:22 · 1022 阅读 · 0 评论 -
预检请求(preflight request)
我们先看看什么是 预检请求:A CORS preflight request is a CORS request that checks to see if the CORS protocol is understood.It is an OPTIONS request, using three HTTP request headers: Access-Control-Request-Method...原创 2018-06-10 00:31:55 · 5711 阅读 · 0 评论 -
Javascript单例模式
点击打开链接很不错的文章转载 2017-09-22 17:42:02 · 353 阅读 · 0 评论 -
JavaScript Tween算法及缓动效果
点击打开链接转载 2017-09-04 16:33:35 · 388 阅读 · 0 评论 -
canvas绘制网格(增加坐标)
1.接着上篇文章,我打算给绘制的表格增加坐标,这样看起来比较方便//绘制网格function drawGrid(CANVAS_WIDTH,CANVAS_HEIGHT,GRID_WIDTH,GRID_HEIGHT){ var rows=parseInt(CANVAS_WIDTH/GRID_WIDTH); var cols=parseInt(CANVAS_HEIGHT/GRID_HE原创 2016-09-06 18:15:12 · 6045 阅读 · 1 评论 -
JS--历史搜索记录的实现
公司最近要做商城,真是压力山大啊!还好招到了一个UI,要不然都不知道如何是好。不罗嗦,商城一般都要有历史搜索记录的实现:看一下效果图:1.实现思路1)用localStorage实现存储,如果重复的搜索内容不存就可以了2)动态添加到列表中2.html 搜索历史记录的使用原创 2016-09-22 19:07:16 · 7670 阅读 · 2 评论 -
freetile.js--创建瀑布流式布局
1.看到花瓣网和Pinterest的网站的瀑布流布局很酷,搜了一下找到这个freetile.js插件作为小白命是很苦的,我们先不研究轮子的制造过程,专心的装轮子,使用好各种工具。然后等用的多了,工作能够很好的完成了。再去学习如何造轮子。不过这次,我打算研究一下这个原理的实现过程,写个系列教程。先看一下效果图:2.先看一下布局 创建瀑布流布局原创 2016-09-20 18:12:54 · 620 阅读 · 0 评论 -
visibility:hidden的元素绑定click event会起作用吗
有时候,你使用了flex布局,但是不得不隐藏某个元素1)若display:none,则破坏了原有的布局。不可行2)visibility:hidden则占据原来的位置,很方便,但元素现在可以点击吗?答案是不可以的。设为visibility:hidden后,元素现在是不可以选择的既然无法选择,即使绑定了click事件,也自然无法点击啦!原创 2016-10-12 11:19:15 · 8927 阅读 · 8 评论 -
商城购买数量选择
1.做个商城数量选择小工具要求的规则: 1).输入范围限定在1-200. 2).超过200则,则进行提示 3.)非法字符禁止输入 4.)一般在客户端验证后,服务器端还是需要重新验证的。2.HTML 数量 - +原创 2016-10-08 11:58:17 · 1469 阅读 · 0 评论 -
JavaScript 数组删除重复项
JavaScript 数组删除重复项1.新建一个数组,过滤添加://delete repeated item in arrayvar number=[1,2,3,6,5,4,3,2,1,2,3,4,5,6,7,8,9,43,2,1];var temp=[]; //temp must be an Array;for(var i=0;i<number.length;++i)转载 2016-07-03 15:28:04 · 271 阅读 · 0 评论 -
iphone 里面使用for in遍历localStorage的特别情况
1.我们先看这样一种情况 localStorage.setItem("a","123"); localStorage.setItem("b","456"); for(var key in localStorage) { console.log(key+":"+localStorage.getItem(key)); }在android里面的输出就是 a:123 b原创 2016-11-11 16:40:11 · 1110 阅读 · 0 评论 -
url处理函数集合
function URL(name){ if(typeof name=="undefined"){ throw new Error("你需要传入一个url作为参数"); } this.name=name;}URL.prototype={ constructor:URL, addArg:function(key,value){ if(this.name.indexOf("?")原创 2016-11-12 15:02:58 · 859 阅读 · 0 评论 -
移动端调试利器之onerror事件
很多时候你可能遇到这样的情况--“这段代码在pc端模拟器运行的好好的,为什么到手机上跑就挂了?”移动端调试又是非常的困难:1)不能断点调试2)不知道错误发生在哪个位置,只能插入大量的alert语句3)使用try catch 要更改代码布局,又不是很美观。而且也不知道哪里挂了。放在代码最外层应该是最合适的下面,我们的主角隆重登场了window.onerror事原创 2016-11-12 17:37:10 · 571 阅读 · 0 评论 -
ES6基本语法学习笔记--let与const
2016/11/14 以前找工作的时候,了解了一下nodejs。现在看到我们的Java后端实力很强劲,决定趁工作不忙的时候,可以多学点nodejs。不懂的问题也可以多请教他。ES5只有2种变量 var function ES6有6种变量 var function let const import class已下内容摘自阮一峰的ECMA 6入门原创 2016-11-14 11:42:15 · 415 阅读 · 0 评论 -
es6基本语法学习--遍历map结构
var m=new Map();// m.set("a",10);// m.set("a",20);// console.log(m);var a=["a"];var b=["a"];console.log(a==b);m.set(a,100);m.set(b,200);m.set(["a"],300);console.log(m);for(let val原创 2016-11-23 10:53:02 · 3096 阅读 · 0 评论 -
JavaScript 抽象语法树(AST)
很棒的文章转载 2017-05-04 10:45:33 · 3129 阅读 · 0 评论 -
hammer.js---拖动滑块实现验证的小demo
1.先看一下效果图 移动端实现,简单方便,只要稍作修改比如用Math.random()函数生成一个随机的位置,然后判断位置差即可。快去试一试这个很fashion的库吧。2.看一下HTML结构 slider Oh!You are so handsome! 3.JS部分function indicato原创 2016-09-19 18:52:00 · 6319 阅读 · 6 评论 -
rgb(a)和16进制相互转换,rgbaToHex, hexToRgb.
最近工作有遇到,就记录一下。其实在写正则表达式的时候,我认为表达清楚是最重要的,简洁反而是其次的。/* rgba(100, 200, 80, 0.7);*/function rgbaToHex (rgba) { rgba = rgba.replace(/\s+/g, ""); // 先剪除字符中的空格,避免写正则时加入过多的\s*; 但是r g b(10, 2 0,...原创 2019-05-01 14:51:34 · 4450 阅读 · 0 评论