此博客停止维护和更新，已转移https://github.com/ilvseyinfu/blog

HTTP协议简介 ：（参考自廖雪峰老师的官方网站http://www.liaoxuefeng.com/wiki/001374738125095c955c1e6d8bb493182103fac9270762a000/001386832653051fd44e44e4f9e4ed08f3e5a5ab550358d000）    服务器把网页传给浏览器 ，实际上是把网页的html代码发送给浏览

最近笔试发现很多公司都在考cookie，而我对cookie的了解仅仅知道它是一门客户端存储技术，通过http协议，通过请求在客户端(浏览器)和服务器端交互，主要作用是记录每次请求后来跟踪会话，所以在没有session之前，基本上所有的网站都是用cookie来跟踪数据的，所谓跟踪数据，其实就是记录数据，比如说你在网站上做了些操作，没有做完，关掉浏览器后下次打开，仍然保留有信息，这就是跟踪数据，记录数

之前考三七互娱时遇到的问题，今天回顾记录下。首先说下题目：clike事件和 Zepto.js 中tap的区别 首先介绍下Zepto：最初是作为移动端开发的库，但是却可以作为JQuery轻量级的替代品，因为API和JQuery相似，而文件更小。介绍下tap和click的区别：两者都会在点击时触发，但是在web手机端，clikc会有200-300ms的延时，所以要用tap代替cli

状态码是由三位数字和原因短语组成 er：200 OK接下来总结几个面试常用的(面试会考的)：200 OK 表示客户端发生的请求在服务器端被正常处理了204 NOT CONTENT 表示服务器正常处理了，但返回的响应报文中不包含实体的主体部分，一般在只需要从客户端往服务器发送信息，而对客户端不需要发送新信息内容的情况下使用。206 Partial Content  改状态码表示客户端

1. margin 重叠问题 因为内容比较多，总结起来不是很方便，我写了一个demo，可以方便查看：margin重叠解读2. margin 百分比计算规则 百分比margin的计算规则： 普通元素的百分比margin都是相对于容器的宽度计算 百分比margin的计算规则： 绝对定位元素的百分比margin是相对于第一个定位祖先元素（fixed/relati

图码结合，很清晰～ Hello ! document.getElementsByClassName("father")[0].addEventListener("click",function(){ alert("father"); },false); document.getEl

body{margin:0;padding: 0 } .left{ width: 200px; position: absolute; height: 500px; background-color: pink; left: 0; top: 0; } .right{ width: 200px; position: absolute;

点击第几个div，就打印几。 闭包 .con{ position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 10vh; height: 30vh; background-color: white; margin: aut

最近工作时修复topbar 渐变色问题的bug，发现 document.body.scrollTop 取值一直为0这里给出三个解决方案：解决方案1：let scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;解决DTD问题htt

河狸家技术面，实现类似圣杯布局，flex有点忘记了，现在回顾下，圣杯布局自己百度～ flex布局回顾 .container{ display: flex; flex-direction:column; min-height: 100vh; } .contents{ display: flex; flex-directio

前言Http 缓存机制作为 web 性能优化的重要手段，对于从事 Web 开发的同学们来说，应该是知识体系库中的一个基础环节，同时对于有志成为前端架构师的同学来说是必备的知识技能。但是对于很多前端同学来说，仅仅只是知道浏览器会对请求的静态文件进行缓存，但是为什么被缓存，缓存是怎样生效的，却并不是很清楚。在此，我会尝试用简单明了的文字，像大家系统的介绍HTTP缓存机制，期望对各位正确

首先先介绍浏览器解析的工作原理：1.解析HTML文档建立dom树2.解析CSS(包含外部css以及js生成的)构建渲染树，计算出节点的样式3.布局渲染树，以根节点递归调用，计算每一个节点的大小，位置等，给出每一个节点出现在屏幕的精准目标4.绘制渲染树，遍历渲染树，每个几点使用ui后端层来绘制可以看出，reflow和repaint分别出现在3/4步，现在我们给出定

HTTP请求： http是计算机通过网络进行通信的规则无状态协议： 不建立一种持久的连接，服务端不保留连接的相关信息，没有记忆(cookie)一个完整的HTTP请求过程(七个步骤)：1. 建立TCP连接2. web浏览器向web服务器发送请求命令3. web浏览器发送请求头信息4. web服务器应答5. web服务器发送应答头信息6. web服务器向浏览器发

首先先解释名词： 同源策略，浏览器的一种安全策略，只有域名协议端口完全一直才能访问。http://www.liuyixiang.cn:80/a.html协议         域名         端口为什么会有这种策略呢？大家看下下面的代码： // 接下来，我们在本地添加一些操作，是不是就能获取相关私密信息了？所以，处于安全的考虑，浏览器是不支持我们跨域访问其它页

.container{ border:1px solid red; /*overflow: hidden;*/ /* 所以，这是消除浮动的第二种方法 给包含浮动元素的父标签添加css属性 overflow:auto; 下面我们来回顾下overflow这个属性： overflow这个属性规定内容溢出元素框时发生的事情 scroll：内容会

CSS 三大特性： 继承/优先级/叠层(后者会覆盖前者)优先级排序：！important > 行内样式 > id选择器 > 类选择器 > 标签选择器 > 通配符 > 继承 > 浏览器默认id选择器（#myid）类选择器（.myclassname）标签选择器（div,h1,p）相邻选择器（h1+p）子选择器（ul 后代选择器（li a）通配符选择器（*

该问题几次笔试都考了，需要了解下，面试也必然会问到。首先先介绍下网站，网站分为前端和后端，可以说前端才是真正和用户直接交互的，除了后台需要做优化外，前端页面更需要在性能上做出优化，只有这样才能给用户带来更好的体验，那什么是web前端？一般来讲，web前端是指网站业务逻辑之外的部分，包括浏览器加载，网站视图模型，图片服务，CDN。接下来介绍下浏览器访问页面时的处理流程：接下来介绍

javascript 实现ajax实例 *{ font-size: 20px; line-height: 1.8; } 员工查询 请输入员工编号： 查询 123 员工新建 请输入员工姓名： 请输入员工编号： 请输入员工性别： 男 女 请输入员工职位： 保存 123 // 改写为json,

前端代码： index.html --> 测试下Ajax在Java后台中实现 请输入要查询的id： 查询 查询结果： 新增学生表单 学生 id   ： 学生姓名： 学生学号： 学生性别： 确认 更新结果： document.getElementBy