web 前段杂
文章平均质量分 63
haliofwu
不想成为顶级美食家的web前端开发工程师都不是好产品经理。
展开
-
SSR
CSR:客户端渲染:简而言之是在浏览器端渲染。先拿到dom,css,通过js(ajax)拿到后台数据挂载在dom上显示;优点:交互性好,可以最小单位的返回数据;适宜使用在交互性强的软件中缺点:seo 比较差;蜘蛛只能识别html,不能识别js中的文件;SSR:服务端渲染: 后台直接生成含有完备数据的html返回给前端;跟客户端相反;适用于:首屏渲染;交互性小而展示...原创 2019-10-25 14:05:40 · 1166 阅读 · 0 评论 -
node.js中的fs.readFileSync方法使用说明
fs.readFileSync(filename, [encoding])由于该方法属于fs模块,使用前需要引入fs模块(var fs= require(“fs”) )接收参数:filename 文件路径options option对象,包含 encoding,编码格式,该项是可选的。例子:复制代码代码如下:var fs = require('fs'转载 2016-06-30 15:31:37 · 43449 阅读 · 1 评论 -
nodejs 遍历目录结构
nodejs 的递归算法的应用。var fs = require("fs")function walk(dir) { var children = [] fs.readdirSync(dir).forEach(function(filename){ var path = dir+"/"+filename var stat = fs.statS原创 2016-07-05 11:03:04 · 5019 阅读 · 0 评论 -
node版本n模块升级的路径问题
node版本升级比较快捷的方法是n模块。n模块是专门管理node版本的模块。先安装n模块:sudo npm install -g n然后:n stablenode -v查看版本号。如果变为最新,则 node和npm都得到了升级。如果没有,则需要添加n模块路径到PATH。查看 计算机-usr/local/bin 与usr/local/n ------node老版本安装在usr原创 2016-07-12 11:07:21 · 5012 阅读 · 0 评论 -
掌握这些angular 算是入门了
1.AngularJS 通过 ng-directives 扩展了 HTML。ng-app 指令定义一个 AngularJS 应用程序。ng-model 指令把元素值(比如输入域的值)绑定到应用程序。ng-bind 指令把应用程序数据绑定到 HTML 视图。2.如果您移除了 ng-app 指令,HTML 将直接把表达式显示出来,不会去计算表达式的结果。原创 2016-06-22 15:45:46 · 1798 阅读 · 0 评论 -
es6
1.http://pythontutor.com/visualize.html#mode=display 超好用的在线调试工具2.let 增加块级作用域吧相当于,跟var不同 const 3.Set 构造函数,类似于数组,没有重复数据。 Map.js中object 提供的是字符串--值的模式,map提供 值--值的模式;原创 2016-06-08 10:52:17 · 324 阅读 · 0 评论 -
js 中this 的陷阱
原文地址:https://segmentfault.com/a/1190000002640298当有人问起你JavaScript有什么特点的时候,你可能立马就想到了单线程、事件驱动、面向对象等一堆词语,但是如果真的让你解释一下这些概念,可能真解释不清楚。有句话这么说:如果你不能向一个6岁小孩解释清楚一个东西,那么你自己也不懂这个东西。这句话或许有点夸张,但是极其有道理。个人觉得,如果需转载 2016-06-06 17:21:59 · 397 阅读 · 0 评论 -
js模块化编程之彻底弄懂CommonJS和AMD/CMD!
先回答我:为什么模块很重要? 答:因为有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块。但是,这样做有一个前提,那就是大家必须以同样的方式编写模块,否则你有你的写法,我有我的写法,岂不是乱了套!于是下面三个模块规范出来了,这篇文章也出来了(拼出来的 {捂脸笑})。 JS中的模块规范(CommonJS,AMD,CMD),如果你听过js模块化这个东西,那么你就应该听过或Comm...转载 2016-06-27 14:35:54 · 4040 阅读 · 0 评论 -
js犀牛书
1.null /undefine/数字/布尔值/字符串 无法改变的值,可做比较。 基本类型2.使用字符串属性时,会自动生成一个临时变量。并不会改变原来的值。var a="test"读取:a[0]为:"t"设置a[0]="r"a //再次读取a值"test"3.对象的值不是值的比较,即使两个对象包含相同的属性及值,也 不相等。o={x:1},p={x:1}原创 2016-05-27 18:01:46 · 2405 阅读 · 0 评论 -
[腾讯]前端面试题整理
prototype 与 proto的关系是什么:__proto__是什么?我们在这里简单地说下。每个对象都会在其内部初始化一个属性,就是__proto__,当我们访问一个对象的属性 时,如果这个对象内部不存在这个属性,那么他就会去__proto__里找这个属性,这个__proto__又会有自己的__proto__,于是就这样 一直找下去,也就是我们平时所说的原型链的概念。<script type=原创 2017-12-21 10:53:32 · 5359 阅读 · 0 评论 -
跨域问题(iframe)记录
an ancestor violates the following Content Security Policy directive: “frame-ancestors ‘self’场景描述: iframe内嵌jupyter页面; 本地安装jupyter,命令行jupyter notebook开启,在本地开发环境下的页面内嵌入iframe<div id="left...原创 2018-04-10 09:42:53 · 24380 阅读 · 14 评论 -
【problem记录】
iframe嵌入jupyter页面的跨域问题 解决方法:必须在服务器端设置允许。 参照上一篇文章。值得注意的是,jupyter本身有一个配置文件,可以在里面配置。2.前端调用jupyter service api跨域问题,可以使用:var proxy = require('http-proxy-middleware');app.use('/api/contents/', pro...原创 2018-04-17 09:48:14 · 302 阅读 · 0 评论 -
wj中期总结
canvas 上传图片到canvas,并可对其进行放大缩小,移动等; 需要注意的是,当同一个页面有多个canvas,鼠标在canvas上的图片时进行缩放,此时如果不做特别说明,将会对所有canvas中的图片进行缩放。轮播 改成自己需要的轮播样式;前端图片下载前端文件上传semantic modal 关闭,进入其他route再返回时,出现多个modal 的解决方法,监听每一个cont...原创 2018-05-15 18:18:44 · 242 阅读 · 0 评论 -
overflow:auto 时页面滚动条出现时跳动
产生环境: ant.design写的Item的时候,给选中添加背景.但是发现,在点击全部时,页面会有跳动,其他章节则不会有跳动. 章节内容的展示,是以 {width:1000px;margin:auto}或者 grid 的 auto 1000px auto 去实现的.最后发现问题的所在是: 全部的时候因为内容较多,右侧产生了滚动条;而其他章节的时候,因为内容少,...原创 2018-05-30 13:55:38 · 3370 阅读 · 0 评论 -
浏览器兼容问题记录
chrome,firefox : grid 与 flex 的兼容;IE10,IE11:1.@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {}以此来识别IE10+以上的浏览器.但是注意,在该属性内的class,只会对没在该属性内的class的属性进行替代.如果比如:.oper-wrap { ...原创 2018-10-11 17:21:20 · 995 阅读 · 0 评论 -
webpack完整记录
碎碎念:之前一直在csdn.总觉得csdn氛围不太好,但是因为懒嘛,一直没有迁移.今天波特问我,是否可将我的csdn账号借给他下点东西.我记得我csdn好几千积分的.结果一看,现在积分不能下载了,要靠c币.c币是什么呢?一个c币=300阅读量.这就算了,还有过期机制.一段时间没用,就给清零了…这已经强制大家充币赚钱了…所以,果然是要倒闭了么.正文webpack入门文章webpack入...原创 2018-10-18 18:27:38 · 828 阅读 · 0 评论 -
记一次Bug
这个Bug查了好几个小时…如此愚蠢的一个Bug…给自己跪了. <Menu onClick={this.getComponent} mode="horizontal" selectedKeys={[currentPage]} style={{ lineHeight: '62px', borde...原创 2018-12-06 20:43:56 · 381 阅读 · 0 评论 -
jQuery插件的几种写法
之前在一篇求职的帖子上看过,前端面试的景点题目:jquery插件的几种写法。这是看到的一篇总结。比较到位。详尽且简单易懂。如果之前看过jquery的源码,应该特别好理解了。插件编写的目的是给已经有的一系列方法或函数做一个封装,以便在其他地方重复使用,方便后期维护。一、jQuery插件开发方式1、通过$.extend()来扩展jQuery2、通过$.fn 向j转载 2016-06-27 16:12:03 · 9745 阅读 · 0 评论 -
serve-static
问题1:serve-static的setHeaders有什么用?[javascript] view plain copy var express = require('express') var serveStatic = require('serve-static') //这个中间件也可以通过express.static来引入,第二个参数同样表示的是和serv转载 2016-07-15 17:59:10 · 1998 阅读 · 0 评论 -
教你上传本地代码到github
转载请标明出处: http://blog.csdn.net/hanhailong726188/article/details/46738929本文出自:【海龙的博客】言归正传,最近有人在群里问怎么将新创建的本地代码上传到github上,这里简单的记录一下,我喜欢使用命令行,这里全用命令行来实现,不了解git命令的可以去了解下。第一步:建立git仓库 cd到你转载 2016-08-05 14:52:36 · 287 阅读 · 0 评论 -
2016.5.11
1.《浏览器端测试:mocha,chai,phantomjs》mocha init 测试框架脚手架。mocha init (显示错误,只有mocha init file 在file中才正确)或者 mocha init .(点不要忘了).├── index.html # 这是前端单元测试的入口├── mocha.css├── mocha.js└── tests.j原创 2016-05-11 18:06:01 · 292 阅读 · 0 评论 -
2016.5.9
最近想要看的资料:1.async /wind.js/step2.《代码大全》3.原型函数4.mysql看完5.jquery/bootstrap/6.移动端开发经验今日学习进度:1.http://blog.fens.me/series-nodejs/ 《nodejs从零开始》。不是很详细,很多个工具不熟悉。2.js 中"||""&&"Js代码 va原创 2016-05-09 18:05:23 · 548 阅读 · 0 评论 -
前端优化的14条原则
作者:Yao Sun链接:https://www.zhihu.com/question/40505685/answer/101627021来源:知乎著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。规则01:尽量减少HTTP请求前端优化的黄金准则指导着前端页面的优化策略:只有10%-20%的最终用户响应时间花在接受请求的HTML文档上,剩下的80%-90%转载 2016-06-08 11:04:57 · 384 阅读 · 0 评论 -
exports 和 module.exports 的区别
原链接:http://cnodejs.org/topic/5231a630101e574521e45ef8我理解的exports 和 module.exports 的区别,欢迎大家吐槽~为了更好的理解 exports 和 module.exports 的关系,我们先来补点 js 基础。示例:app.jsvar a = {name: 'nswbmw 1'};转载 2016-06-03 14:36:50 · 249 阅读 · 0 评论 -
sass
原文转自:http://www.ruanyifeng.com/blog/2012/06/sass.html学过CSS的人都知道,它不是一种编程语言。你可以用它开发网页样式,但是没法用它编程。也就是说,CSS基本上是设计师的工具,不是程序员的工具。在程序员眼里,CSS是一件很麻烦的东西。它没有变量,也没有条件语句,只是一行行单纯的描述,写起来相当费事。很自然地,有转载 2016-06-06 14:46:26 · 317 阅读 · 0 评论 -
linux 系统下删除缓存/清理孤立包
linux和windows系统不同,linux不会产生无用垃圾文件,但是在升级缓存中,linux不会自动删除这些文件,还是很占硬盘的!一、删除缓存1,非常有用的清理命令:sudo apt-get autoclean 清理旧版本的软件缓存sudo apt-get clean 清理所有软件缓存sudo apt-get autoremove 删除系统不再使用的孤立软件这三个命令主转载 2016-07-11 10:17:47 · 4185 阅读 · 0 评论 -
从安装 Ubuntu 到 使用atom开发
因为一些坑爹的原因,我必须换电脑。所有环境全部得自己搞定。也好,自己把这些都搞一遍记录下来,以后就不怕再重新弄了。1.装ubuntu。因为手中没有光盘,没有U盘。去看过U盘装Ubuntu,对我这种几乎没有自己装过系统的女生来说,还真不是像别人说的那样简单。算了,就装wubi吧。wubi的教程,网上很齐全,之前一直装的14.04,后来发现,之前装过之后,再装就会出现找不到iso的原创 2016-07-08 13:41:15 · 2375 阅读 · 0 评论 -
从bodyParse来看app.use()
csdn没有转发功能,看到好的文章不能mark。只好手动转载过来了。前言 最近一直在学习慕课网上的express+mongodb建站课程,老师用了很多模块,以前从未见过,因此慢慢看API文档,调代码,试图把每一个框架都搞懂。 前一篇写了express一些用法,这一篇也是接上文的,主要是提到了app.use()。 因为在本项目中,app.use()方法主要用在,a转载 2016-07-15 15:20:50 · 864 阅读 · 0 评论 -
iconv-lite
node当使用node获取GBK编码的数据时,nodejs只支持utf-8,node没有提供转换编码的原生支持,有倒是有一个模块iconv能干这个事,但需要本地方法,VC++库的支持。国外有个大牛写了一个纯粹用Javascript解码的模块:iconv-lite,可以实现编码转换,使用方法如下:var http = require("http");var iconv = require("i转载 2016-07-15 15:44:46 · 4965 阅读 · 0 评论 -
nodejs 的fs 的所有用法
node.js之fs模块转载 2016-07-05 09:36:37 · 4940 阅读 · 0 评论 -
Webpack傻瓜式指南(未完待续)
首发于前端外刊评论已关注写文章Webpack傻瓜式指南(一)张轩 · 6 个月前Webpack最近很热,我一开始是想翻译一篇国外关于webpack的佳作,但是找来找去也没有一篇让我感觉到很满意的,好多都是一步到位,满屏幕都是React+Webpack,官方文档写的不太好,好多点都没有解释转载 2016-06-06 14:42:00 · 1266 阅读 · 0 评论 -
一个月学习成果
1.《js犀牛书》2.《js精华》3.《js Dom》4.《css那些事》5.廖学峰《js》包括高阶函数/闭包/箭头函数/正则/JSON/原型继承/CLASS继承/浏览器(操作表单/文件/DOM)/ajax/promise/canvas/jquery/underscore/nodejs/模块6.vue 两个系列的视频(现在都快又忘记了)7.webpack +vue(两个项目原创 2016-06-21 16:10:16 · 397 阅读 · 0 评论 -
Ubuntu chmod命令使用方法详解
Linux/Ubuntu 系统中文件调用的权限分为三级:文件拥有者(u)、群组(g)、其他(o)。用chmod就可以更改文件的权限。chmod是一个相当灵活的命令,对同一个文件的权限的修改可以用多种风格的命令格式来实现。 方式一: 语法格式: chmod [-vR] mode 文件名 参数说明: mode 权限设置字串,格式为[ugoa] [+-=] [rw转载 2016-06-21 16:47:26 · 10291 阅读 · 0 评论 -
electron ubuntu镜像安装及入门
新项目是在electron上开发的。electron 模拟桌面应用,比如手机app这种。听上去高大上的。很开心跑去安装。结果发现,呢嘛,有墙啊。安装好多次都无法下载下来。我表示很懵逼啊。后来才反应过来,因为没有翻墙,npm被墙了。好吧,那我去一次性看看镜像是个什么玩意儿吧。1)镜像方法:1.编辑 ~/.npmrc 加入下面内容 registry = https://reg原创 2016-06-23 17:17:13 · 4399 阅读 · 0 评论 -
grunt等工具uglify angularjs 控制器注入失败的问题
问题引入源文件是csp.js. 使用grunt的uglify压缩后的文件是csp.min.js. 其中,csp.js的结构如下:var cmsApp = angular.module('cmsApp', ['cmsController', 'cmsService', 'cmsDirective', 'oc.lazyLoad']);angular.module('cmsController', [原创 2017-12-05 10:33:54 · 384 阅读 · 0 评论 -
[angular]知识碎片
angularjs知识碎片。算是对之前的一个查漏补缺吧。原创 2017-12-14 13:23:56 · 223 阅读 · 0 评论 -
2016.5.10
1.async_demo完成(Async是一个流程控制工具包,提供了直接而强大的异步功能。基于Javascript为Node.js设计,同时也可以直接在浏览器中使用。Async提供了大约20个函数,包括常用的 map, reduce, filter, forEach 等,异步流程控制模式包括,串行(series),并行(parallel),瀑布(waterfall)等。)基本上原创 2016-05-10 18:02:24 · 587 阅读 · 0 评论