自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

Web全栈笔记

曾经的雄心壮志,如今的低头打码

  • 博客(42)
  • 收藏
  • 关注

原创 107个基础常用JS语法大集合

网站特效离不开脚本,javascript是最常用的脚本语言,我们归纳一下常用的基础函数和语法:1.输出语句:document.write(“”); 2.JS中的注释为// 3.传统的HTML文档顺序是:document->html->(head,body) 4.一个浏览器窗口中的DOM顺序是:window->(navigator,screen,history,location,documen

2017-02-17 21:31:27 752

原创 前端,不要太过依赖JQuery库(三)

今天2月4号,年初八。先在大家拜个年,年初八,发发发,祝大家开工大吉。回归正题,在前端,不要太过依赖JQuery库(一)和前端,不要太过依赖JQuery库(二)两篇文章中已经列举了大量的使用原生JavaScript替代JQuery的例子,在本文中将继续列举!1、表单获取焦点$('#test').focus(); $('#test').focus(function(){});var t = docu

2017-02-04 11:25:41 2298

转载 使用Webpack打包单页应用的正确姿势

导语:在现代前端工程中,模块化已经成了前端项目组织文件的标配,网站上线前都会把需要的相关模块预先打包、处理一番。然而打包的方式多种多样,如何才能最优雅的分离业务代码和依赖库?如何才能最高效的利用缓存?本文将会和大家分享饿了么前端团队总结的各方案优劣、踩过的坑,以及最终的解决方案。对于前端而言,缩短网页加载时间的常见方式有:合并文件以减少网络请求数量。对静态文件设置长达一年的缓存,让浏览器直接从缓

2017-02-03 10:46:50 5734 2

原创 前端,不要太过依赖JQuery库(二)

为什么说不要过度依赖JQuery呢?从项目方面来讲,一些项目在开发中实际用到JQuery内置功能不多,这样会造成项目臃肿;另一方面,目前的主流已经倾向于原生开发。而在之前一篇《前端,不要太过依赖JQuery库(一)》一文中已经介绍了部分使用原生JavaScript实现JQuery功能的代码,这一章将继续列举。1、位置获取相对于文档的位置$('#test').offset() function off

2017-02-02 11:46:09 2005

转载 看完这篇文章才对GIT有了大彻大悟的认识

git定义:版本管理工具历史:没有git的时候,我们修改完一个文件,要先把文件拷贝一个副本到备份文件夹中,还要建个文档来记录当前文件的信息和操作记录。当文件多的时候,人工操作起来将是个非常辛苦非常庞大的工作量。如今:有了git帮我们管理这些副本,为我们节约了非常大的人力成本,让我们的工作 变得更加轻松。我们不要把git看得那么神秘,git的核心就是创建备份和恢复备份,但是衍生出一堆的新概念,这些抽象

2017-02-01 14:56:45 4792

原创 Web程序员的办公桌是这样的!你的办公桌是怎样的?

对于很多程序员来说,上班的时候,要是只有一个小屏,然后各种软件来回的切换,简直会吐血。大家都说,程序员的办公桌要是多屏、大屏,相当有必要。就像web程序员,如果有两个屏幕的话,一个屏幕用来写代码,一个屏幕用来调试,简直是很棒。那么程序员的办公桌都是怎么样的呢?是不是真的有多屏?这位程序员的办公桌,看起来很干净、整齐。关键是,这位网友写代码的时候,竟然是站着写的。而且站累了,据说会蹲在椅子上歇歇。这位

2017-02-01 14:37:42 9566 2

转载 PHP命令行下的世界

PHP作为一门web开发语言,通常情况下我们都是在Web Server中运行PHP,使用浏览器访问,因此很少关注其命令行操作以及相关参数的使用,但是,特别是在类Unix操作系统上,PHP可以作为一门脚本语言执行与shell类似的处理任务。php命令行(CLI)参数详解查看PHP的所有命令行参数,使用php -h命令。我们将会对大部分常用的命令行参数进行一一解释,以加深对PHP能力的认识,更加快捷的在

2017-02-01 14:15:38 3547

原创 前端,不要太过依赖JQuery库(一)

毫无疑问,JQuery是一款非常优秀的JavaScript库,它让我们开发项目变得更加便捷容易。不过,当你准备在一个项目(特别是移动项目)中使用JQuery时,你真的该好好思考一下,你会用到JQuery的哪些功能,是否真的需要jQuery。因为随着JavaScript的不断改善进化,现在它内置的功能已经非常强大,在很大程度上,已经可以实现以前需要在JQuery中才能实现的技术(如果你的项目需要在IE

2017-01-31 22:57:23 3542

原创 阿里巴巴2016前端工程师面试题

1、请列举7种以上常用的HTML标签,说明其语义。 1)div标签,是一个块元素,就像一个大盒子,可以放各式各样的东西; 2)p标签,也是一个块元素,它通常用来放一段话的….; 3)h1,h2,h3,…h6标签,也是块元素,常用来放标题; 4)span标签,是一个行内元素,常用来处理一段话中的某几个字符; 5)img标签,用来加载图片的标签; 6)table标签,用来创建表格

2017-01-30 18:52:58 22409 11

原创 送给曾经有黑客梦的前端工程师小伙伴

我们常常会在一些好莱坞电影大片里看到超级黑客高手,在电脑前轻松“黑”进别人的安全系统的场景。那纯熟自如地输入一大堆复杂的代码,不一下子就入侵/破解完成,是不是很羡慕?其实咱们也可以像电影、游戏里面的黑客一样敲代码,今天就介绍一个传说中的装逼神器 HackerTyper 给你吧!它是一个专门为装 B 而制作的神奇好玩的网页,打开之后只要随便按键盘,你就可以屌到爆地写代码当黑客,逼格立即高达上好不好?!

2017-01-29 18:06:51 3357 2

原创 Web全栈笔记之生成随机验证码

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <title>Document</title>

2017-01-23 17:13:04 2178

原创 Web全栈笔记之DOM编程艺术

一、代码命名规范: 1. 变量使用下划线 2. 函数使用驼峰命名二、DOM定义:DOM是一套对文档的内容进行抽象和概念化的方法.D:文档 documentO: 对象 objectM: 模型 ModelDOM是一种适用于多种环境和多种程序设计语言的通用型API。 1. 文档是由节点构成的集合,只不过此时的节点是文档树上的树枝和树叶而已 2. 一个文档就是一颗节点树

2017-01-23 17:02:39 2549

原创 Web全栈笔记之全选反向(新手必备)

javascript实现一个简单的列表选择效果,全选,全不选,反选功能。实现思路获取所有需要选中的元素,通过getElementsByName();对获取的到的元素进行for循环;反选的方法做一个判断,判断元素自身是否在选中状态checked;ture 为选中,false 或“”为不选。看具体代码实现HTML结构: <ul style="list-style: none;">

2017-01-19 10:06:32 1705

原创 2017进入前端的必备资料!!~~

先来个大概预览:项目工程化发展方向职业环境总结要掌握的框架/技能小结放在前:2017的前端与其说更残酷,不如说更规范化,前两年各种培训了几个月就出来随口开价上万,几万的新手将被市场淘汰。前端开发工具/编译工具 逐渐成型,虽然比不上object-c, java, C+ 等排名靠前编程语言有完善的IDE环境,但是。工程化模块化的概念开始深入人心,这年头还编写原始HTML CSS Javas

2017-01-18 22:48:52 4396

原创 新手进阶WebStorm工具的基本使用

WebStorm混搭svnWebStorm混搭nodeJS以less和uglify-js为例如何用npm在root中下载模块 webstorm简单介绍欲先善其事,必先利其器,如题。看到网上一篇介绍webstrom的文章,觉得功能确实强大,也知道为什么阿里巴巴的前端传到github上的文件为啥都有一个 .idea 文件,(传说淘宝内部推荐写js用webstrom)我们可以理解 IDE 就是集成了很多

2017-01-18 22:24:14 5030 1

原创 微信小程序:一是款充满无限可能的产品

在2016年底的微信公开课上,张小龙进行了一次关于小程序“十问十答”的主题演讲其中的核心思想包括:小程序的目标是线下服务和商家小程序要挖掘和覆盖新的服务场景和提供新的服务能力用完即走(利用工具快速有效的完成一项服务)的理念小程序没有入口,启动来源于二维码,去中心化小程序是一个活的信息1月9号00:00,小程序如期而至,对小程序的初次体验还是非常有意思的:1、如果没有群里的朋友分享,我还真

2017-01-12 13:43:46 3767

原创 身为前端的我们与小程序的开发距离有多远?

对焦10年前iPhone的发布时间,产品之神张小龙显然是想让这一天具有十分重要的历史意义。小程序发布之后,它终于揭开了最终面目,我们不得不承认,这一天,必定是一个新时代的开端。作为一个第一批小程序的开发者,从小程序内测之初通过开发工具破解版开始尝试小程序,见证了小程序官方文档的每一次更新,踩过小程序的大多数坑,也见证了好几个小程序社区的逐步发展,到最终把自己的小程序过审上线,这个过程对我而言,收获良

2017-01-12 09:51:30 6989

原创 DIV+CSS兼容所有浏览器的技巧大全

CSS技巧1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了。缺点是要控制内容不要换行? 2. margin加倍的问题?设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。解决方案是在这个div里面加上display:inline;?

2017-01-11 21:55:05 1460

原创 阮一峰:Javascript的10个设计缺陷 你同意几个?

今天的这一篇,前半部分就谈为什么会这样,后半部分将列举Javascript的10个设计缺陷。我参考的文献主要是Douglas Crockford的专著《JavaScript语言精粹》(JavaScript: The Good Parts)和Fredrik Holmström的文章《我对Javascript的抱怨》(My gripes with Javascript)。一、为什么Javascript有

2017-01-11 21:48:11 2960 1

原创 原创:微信小程序使用flex样式属性(干货)

Flex布局相对于以前我们经常所用到的布局方式要好的很多,在做微信小程序的时候要既能符合微信小程序的文档开发要求,又能使用不同以往的居中方式并减少css的相关样式声明。先来看看关于flex的一张图:从上面可以看到一些flexbox的相关信息,main axis 和 cross axis 指的是flexbox内部flex项目(flex item)的排列方向,通俗点说就是,里面的flex项目是按照横轴或

2017-01-11 16:28:12 4157

原创 移动端开发基础之适配

说到移动端适配,首先我们需要先搞清楚一些基础知识,所以本文路线是先了解像素,dpr,视口等基础知识,然后再整理出移动端适配方案。像素像素其实分为两种,分别是物理像素和CSS像素物理像素(设备像素)物理像素,顾名思义,显示屏是由一个个物理像素点组成的,通过控制每个像素点的颜色,使屏幕显示出不同的图像,屏幕从工厂出来那天起,它上面的物理像素点就固定不变了,单位pt。 通常我们看一些电子设备的参数,比如

2017-01-11 11:37:39 2033 1

原创 web前端这么缺人,然而你还是找不到工作!我归结于以下几点

一:web前端就业要求变高因为互联网的发展速度很快,而对于用户体验的要求也越来越高,而在网站方面,对于前端的要求肯定也是提高的,就拿天猫为例,每年双十一大战,访问越来越大,这不仅是关乎到后台数据的处理,对于前端的要求也更高。 两年前到去年年初,会静态网页的制作,就可以找到一份前端的工作。 去年年末,只要对js比较熟练就可以找到一份好点的前端工作。 而到了今年下半年开始,不仅仅是需要熟练js,还

2017-01-11 10:47:32 16291 1

原创 (干货)微信小程序开发经验总结

一: 参数传值的方法1: data-id 我们可以给HTML元素添加data-*属性来传递我们需要的值,使用方法说明: (1)设置data-id<view class="block" bindtap="playTap" data-id="{{modle.id}}">(2): 取值 + 传值playTap:function(e) { const dataset = e.curre

2017-01-11 10:07:31 32842 1

原创 小程序正式发布前调整服务范围,扩展直播、社交等多项服务领域

前几天微信的张小龙开发布会,亲自讲解了微信小程序的来龙去脉,并在直播会上透露2017年1月9日讲正式发布微信小程序,目前还是测试阶段。不过今天小编发现,已经有朋友爆料,微信更新了小程序的服务范围。微信小程序号的具体服务类目,大家可以看下面这张表格: 这里面的变化很多,大家可以看看之前的小程序号服务类目进行比较: 可以看的出来,微信公众平台小程序提供的服务类容,原来越丰富了,提示下已经开通

2017-01-06 21:30:15 1961

原创 微信小程序的流量红利何在?你不知道的三件事!!~~

一:微信小程序的流量红利何在?微信小程序的出现,对于习惯于暴力吸粉、搞100000+大流量的“既得利益者”而言,确实有一丝丝的失望和迷茫。为啥呢?因为微信小程序拒绝流量分发,不给转发朋友圈,也不可能有推荐,由于无须下载,当然更不可能有什么“小程序商店”,也不会做任何的分类、排行、推荐,即使可以通过搜索来寻找到微信小程序,但也会极力限制。所以,微信小程序基本等于说,这不能、那不能,你要指望借助微信小程

2017-01-03 13:52:28 9651

原创 2016年 CSS 库、框架和工具新生榜 TOP 50

CSS 于 2016 年发布的开源项目,其产量之大超出人们的预料,但纵观 CSS 在过去几年的巨大变化与快速发展,此结果的出现似乎又在情理之中。这些 CSS 库、框架和工具的建立不仅给我们提供了学习的视角,更给我们的工作与生活带来了便利。本文精选了 50 款 2016 年发布的 CSS 库、框架和工具供大家享用,希望它们对您有所帮助。分类快速预览:CSS 库,CSS Spinners,CSS 图像特

2017-01-03 13:37:10 1975

原创 工作中实用代码之搜索栏(赶紧收藏)

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>搜索框</title> <style> *{margin: 0;padding: 0;font-family: "微软雅黑";} input{outline: none;border: 0;}

2017-01-02 22:38:08 625

原创 我眼中的优秀的团队

文中的“我”,其实不是一个单纯的角色,它可能会包含多层含义,不管是我作为一个团队的管理者,还是我作为一名技术团队的普通员工,都会对自己的团队有一些期许,一些定义,一些要求,而这就是今天我们要谈论的话题。希望这些思考能够对管理者或者求职者有些帮助。团队的首先组成就是人,那我理想中的技术团队中的人应该是怎样的呢?作为团队的负责人,其实对于人这方面的把关我一直是非常严格的,对于进入到我团队里的成

2017-01-01 21:46:00 4565

原创 Web前端开发必备网站

大牛博客阮一峰博客: http://www.ruanyifeng.com/blog/愚人码头博客: http://www.css88.com/张鑫旭博客:http://www.zhangxinxu.com/wordpress/勾三股四博客: http://jiongks.name/前端博客: http://caibaojian.com/大漠穷秋: https://my.oschina.net/mum

2017-01-01 21:09:40 2359 1

原创 html5手机端触屏事件(touch事件)第二章

touchstart: // 手指放到屏幕上的时候触发 touchmove: // 手指在屏幕上移动的时候触发 touchend: // 手指从屏幕上拿起的时候触发 touchcancel: // 系统取消touch事件的时候触发。至于系统什么时候会取消,不详 事件属性一般通过 event.changedTouches获得client / clientY:// 触摸点相对于浏览

2017-01-01 20:59:55 1517

原创 html5手机端触屏事件(touch事件)第一章

touchstart:触摸开始的时候触发touchmove:手指在屏幕上滑动的时候触发touchend:触摸结束的时候触发而每个触摸事件都包括了三个触摸列表,每个列表里包含了对应的一系列触摸点(用来实现多点触控):touches:当前位于屏幕上的所有手指的列表。targetTouches:位于当前DOM元素上手指的列表。changedTouches:涉及当前事件手指的列表。每个触摸点由包含了如下触摸

2017-01-01 20:57:53 543

转载 AJAX 状态值(readyState)与状态码(status)详解

1- AJAX状态值与状态码区别AJAX状态值是指,运行AJAX所经历过的几种状态,无论访问是否成功都将响应的步骤,可以理解成为AJAX运行步骤。如:正在发送,正在响应等,由AJAX对象与服务器交互时所得;使用“ajax.readyState”获得。(由数字1~4单位数字组成)AJAX状态码是指,无论AJAX访问是否成功,由HTTP协议根据所提交的信息,服务器所返回的HTTP头信息代码,该

2017-01-01 20:32:32 1573

转载 前端轻松破解支付宝AR抢红包

近期阿里搞了各LBS+AR实景的红包玩法,小伙伴们在公司里都玩疯了~有时候为了抢一个红包,会跑到另一个地方去拍照,虽然略麻烦,但整体的互动还是很有意思的。不过对于机智的前端童鞋来说,只需要简单的一段代码就能破解AR红包(当然成功率也不是100%)。破解原理见《上线仅一天:支付宝AR红包惨遭技术流破解》(https://news.cnblogs.com/n/559670/),感谢这位设计师童鞋。我们要

2016-12-26 20:44:05 1603

原创 最详细的Hexo Next主题配置教程

配置环境安装Node(必须)作用:用来生成静态页面的到Node.js官网下载相应平台的最新版本,一路安装即可。安装Git(必须)作用:把本地的hexo内容提交到github上去.安装Xcode就自带有Git,我就不多说了。申请GitHub(必须)作用:是用来做博客的远程创库、域名、服务器之类的,怎么与本地hexo建立连接等下讲。安装hexoNode和Git都安装好后,首先创建一个文件夹,如blog,

2016-12-24 21:03:17 17205

转载 23条前端性能优化,看懂就够了!

前端性能优化是个巨大的课题,如果要面面俱到的说的话,估计三天三夜说不完。所以我们就从实际的工程应用角度出发,聊我们最常遇见的前端优化问题。1. 减少HTTP请求次数尽量合并图片、CSS、JS。比如加载一个页面,如果有5个css文件的话,那么会发出5次http请求,这样会让用户第一次访问你的页面的时候会长时间等待。而如果把这个5个文件合成一个的话,就只需要发出一次http请求,节省网络请求时间,加快页

2016-12-11 13:44:55 898

原创 Web全栈笔记之Nojs.js第二章

模块化开发模块的规范目前,通行的Javascript模块规范共有两种:CMD和AMD。AMD 是 RequireJS 在推广过程中对模块定义的规范化产出。CMD 是 SeaJS 在推广过程中对模块定义的规范化产出。这些规范的目的都是为了 JavaScript 的模块化开发,特别是在浏览器端的。目前这些规范的实现都能达成浏览器端模块化开发的目的。 1. 对于依赖的模块,AMD 是提前执行,CMD

2016-12-06 10:34:43 2394

原创 Web全栈笔记之node.js第一章

一、什么是nodenode是js语言的服务器运行环境(类似于php和apache) nodejs提供大量的工具库,使得javascirpt可以调用操作系统级别的api。 node采用谷歌的v8引擎(javascipt语言解释器),速度非常快跟js环境不一样,一个是运行在服务器,一个运行在客户端,node是一个基于事件驱动和异步io的服务器javascript环境回调:异步编程的基本方法,采用后续

2016-12-06 10:27:18 1641

原创 Web全栈笔记之Angular基础

简介AngularJS 是一个为动态WEB应用设计的结构框架,提供给大家一种新的开发应用方式,这种方式可以让你扩展HTML的语法,以弥补在构建动态WEB应用时静态文本的不足,从而在web应用程序中使用HTML声明动态内容。AngularJS有五个主要核心特性,如下介绍:双向数据绑定 —— 实现了把model与view完全绑定在一起,model变化,view也变化,反之亦然。模板 —— 在Angu

2016-11-29 21:44:45 1463 2

原创 2016年11月前端面试题整理汇总

本文旨在加深对前端知识点的理解,资料来源于网络,由本人收集整理。一些开放性题目1.自我介绍:除了基本个人信息以外,面试官更想听的是你与众不同的地方和你的优势。2.项目介绍3.如何看待前端开发?4.平时是如何学习前端开发的?5.未来三到五年的规划是怎样的?position的值, relative和absolute分别是相对于谁进行定位的?absolute :生成绝对定位的元素, 相对于最近一级的 定

2016-11-29 13:04:58 11049

原创 Web全栈笔记之微信公众平台开发

1.微信公众测试平台用微信扫一扫登陆微信公众测试平台 2.接口配置接入指南查看接口文档下载示例代码示例代码文件设置 然后上传到服务器公众平台设置接口信息 如果填写信息无误提示配置成功3.获取access_token获取access_token文档access_token是公众号的全局唯一票据,公众号调用各接口时都需使用access_token。开发者需要进行妥善保存。access_token的

2016-11-28 08:56:02 3040

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除