前端学习(20160927-1015)

尾递归
接收参数时,要校验类型
要学习使用ES6写法

Sublime插件  
Ctrl+shift+P调出命令面板
输入install调出Install Package选项并回车

Nodejs学习
express是外部命令   
最新express版本中将命令工具分家出来了(项目地址:https://github.com/expressjs/generator),所以我们还需要安装一个命令工具,命令如下:
npm install -g express-generator

BFC

Block Formatting Contexts (块级格式化上下文)    

http://www.cnblogs.com/leejersey/p/3991400.html

BFC 定义
  BFC(Block formatting context)直译为"块级格式化上下文"。它是一个独立的渲染区域,只有Block-level box参与, 它规定了内部的Block-level Box如何布局,并且与这个区域外部毫不相干。
BFC布局规则:
- 内部的Box会在垂直方向,一个接一个地放置。
- Box垂直方向的距离由margin决定。属于同一个BFC的两个相邻Box的margin会发生重叠
- 每个元素的margin box的左边, 与包含块border box的左边相接触(对于从左往右的格式化,否则相反)。即使存在浮动也是如此。
- BFC的区域不会与float box重叠。
- BFC就是页面上的一个隔离的独立容器,容器里面的子元素不会影响到外面的元素。反之也如此。
- 计算BFC的高度时,浮动元素也参与计算
清除浮动  http://kayosite.com/remove-floating-style-in-detail.html
触发 BFC 的条件如下:
- 浮动元素,float 除 none 以外的值
- 绝对定位元素,position(absolute,fixed)
- display 为以下其中之一的值 inline-blocks,table-cells,table-captions
- overflow 除了 visible 以外的值(hidden,auto,scroll)
在 CSS3 中,BFC 叫做 Flow Root,并增加了一些触发条件:
- display 的 table-caption 值

- position 的 fixed 值,其实 fixed 是 absolute 的一个子类,因此在 CSS2.1 中使用这个值也会触发 BFC ,只是在 CSS3 中更加明确了这一点。


JS小数取整的函数
1.丢弃小数部分,保留整数部分
js:parseInt(7/2)
2.向上取整,有小数就整数部分加1
js: Math.ceil(7/2)
3,四舍五入.
js: Math.round(7/2)
4,向下取整

js: Math.floor(7/2)


HTTP协议
(来源:百度百科)

 HTTP是一个客户端和服务器端请求和应答的标准(TCP)。客户端是终端用户,服务器端是网站。通过使用Web浏览器、网络爬虫或者其它的工具,客户端发起一个到服务器上指定端口(默认端口为80)的HTTP请求。(我们称这个客户端)叫用户代理(user agent)。应答的服务器上存储着(一些)资源,比如HTML文件和图像。(我们称)这个应答服务器为源服务器(origin server)。在用户代理和源服务器中间可能存在多个中间层,比如代理,网关,或者隧道(tunnels)。
    通常HTTP消息包括客户机向服务器的请求消息和服务器向客户机的响应消息。这两种类型的消息由一个起始行,一个或者多个头域,一个指示头域结束的空行和可选的消息体组成。HTTP的头域包括通用头,请求头,响应头和实体头四个部分。每个头域由一个域名,冒号(:)和域值三部分组成。域名是大小写无关的,域值前可以添加任何数量的空格符,头域可以被扩展为多行,在每行开始处,使用至少一个空格或制表符。
    一次HTTP操作称为一个事务,其工作过程可分为四步:
    首先客户机与服务器需要建立连接。只要单击某个超级链接,HTTP的工作就开始了。
    建立连接后,客户机发送一个请求给服务器,请求方式的格式为:统一资源标识符(URL)、协议版本号,后边是MIME信息包括请求修饰符、客户机信息和可能的内容。
    服务器接到请求后,给予相应的响应信息,其格式为一个状态行,包括信息的协议版本号、一个成功或错误的代码,后边是MIME信息包括服务器信息、实体信息和可能的内容。
    客户端接收服务器所返回的信息通过浏览器显示在用户的显示屏上,然后客户机与服务器断开连接。
    任何服务器除了包括HTML文件以外,还有一个HTTP驻留程序,用于响应用户请求。你的浏览器是HTTP客户,向服务器发送请求,当浏览器中输入了一个开始文件或点击了一个超级链接时,浏览器就向服务器发送了HTTP请求,此请求被送往由IP地址指定的URL。驻留程序接收到请求,在进行必要的操作后回送所要求的文件。在这一过程中,在网络上发送和接收的数据已经被分成一个或多个数据包(packet),每个数据包包括:要传送的数据;控制信息,即告诉网络怎样处理数据包。TCP/IP决定了每个数据包的格式。如果事先不告诉你,你可能不会知道信息被分成用于传输和再重新组合起来的许多小块。
    许多HTTP通讯是由一个用户代理初始化的并且包括一个申请在源服务器上资源的请求。最简单的情况可能是在用户代理(UA)和源服务器(O)之间通过一个单独的连接来完成。
    当一个或多个中介出现在请求/响应链中时,情况就变得复杂一些。中介有三种:代理(Proxy)、网关(Gateway)和通道(Tunnel)。一个代理根据URI的绝对格式来接受请求,重写全部或部分消息,通过URI的标识把已格式化过的请求发送到服务器。网关是一个接收代理,作为一些其它服务器的上层,并且如果必须的话,可以把请求翻译给下层的服务器协议。一个通道作为不改变消息的两个连接之间的中继点。当通讯需要通过一个中介(例如:防火墙等)或者是中介不能识别消息的内容时,通道经常被使用。


离线缓存
https://segmentfault.com/a/1190000002422341
离线存储可以将站点的一些文件存储在本地,在没有网络的时候还是可以访问到以缓存的对应的站点页面,其中这些文件可以包括html,js,css,img等等文件,但其实即使在有网络的时候,浏览器也会优先使用已离线存储的文件,返回一个200(from cache)头。这跟HTTP的缓存使用策略是不同的。
首先,你得告诉浏览器你想要离线存储哪些文件,那就需要有一个缓存文件清单,这跟文件是一个manifest后缀名的文件,注意,使用HTML5的离线存储就必须有这个文件,而且必须在服务器端做修改,使得.manifest后缀名的文件的mime类型为text/cache-manifest。
CACHE: 指定你要浏览器进行离线存储的文件列表,一个文件一行
NETWORK: 跟CACHE相反,指定浏览器一定要通过网络访问的文件列表
FALLBACK: 如果通过网络访问失败了,就去访问紧跟着的那个在本地缓存好的文件文件
指定上述文件,可以用相对路径,也可以用绝对路径,都是ok的。但是绝对路径要加上http://
编辑好这个文件以后就在html文件中引入这个文件浏览器就可以知道要缓存那些文件了。
HTML5的缓存更新策略是由manifest清单是否为最新版本来决定的,所以浏览器首先会根据HTTP的缓存策略去探测manifest清单是否最新,如果最新(浏览器返回304),则不会去下载清单里指定的缓存文件来更新离线存储,如果不是最新的(浏览器返回200),则会根据最新的manifest清单去重新下载指定的一系列文件,然后更新离线存储。这里要注意,由于判断manifest清单是否最新是利用了HTTP的缓存策略的,所以可能出现你更改了manifest文件,但是离线存储却没有更新的情况,这可能是因为你的服务器为你的manifest清单文件设置了相应的缓存头,manifest清单文件还未过期,这是浏览器并没有真正向服务器发起请求确认manifest的新鲜度,而是直接使用了缓存的manifest文件,另外一个需要注意的是,修改了一些文件以后想要让离线存储更新,就必须改动manifest清单文件。
HTML5 引入了应用程序缓存,这意味着 web 应用可进行缓存,并可在没有因特网连接时进行访问。
应用程序缓存为应用带来三个优势:
- 离线浏览 - 用户可在应用离线时使用它们
- 速度 - 已缓存资源加载得更快
- 减少服务器负载 - 浏览器将只从服务器下载更新过或更改过的资源。


判断用户是第一次进入某页面
https://segmentfault.com/q/1010000006616003?_ea=1079181
1、用cookie
2、存localStorage里,但用户换个浏览器或电脑就又会看到
3、存缓存里,每次用户登录时判断userid对应的提示有没有弹出过
4、在数据库中加一个字段,值默认为0,登录时检测该字段是否为0,如果是,改为1


其他

cale()的作用是计算实现自适应布局  http://www.w3cplus.com/css3/how-to-use-css3-calc-function.html

安全的web服务器与客户机之间通过HTTP+SSL协议进行通信

把一个域名解释成ip地址的系统称为DNS

JS 判断浏览器类型及版本,做浏览器兼容  http://blog.csdn.net/bluesnail216/article/details/8105870
JavaScript判断浏览器类型一般有两种办法,一种是根据各种浏览器独有的属性来分辨,另一种是通过分析浏览器的userAgent属性来判断的。在许多情况下,值判断出浏览器类型之后,还需判断浏览器版本才能处理兼容性问题,而判断浏览器的版本一般只能通过分析浏览器的userAgent才能知道。

判断浏览器是否支持某个css属性  http://blog.sina.com.cn/s/blog_74f1a3280102v1vf.html
判断是否支持 text-overflow
if( 'textOverflow' in document.documentElement.style){
alert(1);
}else{
alert(0);
}

让网站变灰  
html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }使用方法:这段代码可以变网页为黑白,将代码加到CSS最顶端就可以实现素装。

利用CSS3制作淡入淡出动画效果  http://www.cnblogs.com/aimyfly/archive/2013/06/14/3135233.html
https://segmentfault.com/a/1190000003067215

浏览器工作原理
http://www.cnblogs.com/wyaocn/p/5761163.html

浏览器兼容问题
http://blog.csdn.net/chuyuqing/article/details/37561313/

Function和function的区别
http://www.2cto.com/kf/201106/92682.html
Function 是Javascript的內置对象,而function(注意大小写)就是从它派生出来的,Function是一种引用类型

Javascript设计模式详解
http://www.cnblogs.com/tugenhua0707/p/5198407.html
http://www.cnblogs.com/TomXu/archive/2012/02/20/2352817.html

事件委托http://www.webhek.com/event-delegate/
target 事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素、文档或窗口。






  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值