作为一名梦想成为一名全栈工程师的男人，收集工具，积攒武器库是一个必要环节。本文主要是自己这些年在学习中积攒的一些工具，这一篇主要是在线网站，以后会介绍其它的工具。 学术篇 CODECOGD gallery latext 符号 Conference Portal 前端 Plunker realfavicongenerator Iconfont 安全 CTF 在线工具 Online Tools pcapfix cmd5 jwt rot13 beautifier ook spectrum-analyzer app.any.run HashKiller 开发 codebottle regexr programiz playground downgit devhints 写作工具 作图工具 图床 squoosh markdown 转微信公众号 百度脑图 效率工具 cvmkr smallpdf remove 总结 学术篇 CODECOGD 这个网站对于一些不能支持 latex 公式的地方很好用，可以直接通过引入带有公式代码的链接生产图片。

去百度面试基础架构部的前端开发实习生，感觉应该跪得很惨。百度上海研发中心挺偏的，离张江还挺远的，还要打车过去。到了百度那边门卫管的挺严的，还要面试官来接。后来，就一个程序员来接我，也就是我的面试官。后来就在他们三楼一个休息的地方开始面试。首先就是自我介绍了，然后就是blabla我一些经历项目而已了。他强调了了一下前端相关的项目经历，但是讲道理我是真心没有前端的项目经历，所以也说不上什么。唯一做的也就是我自己的个人主页，还基本上都是静态页面。然后开始正式面试，他首先问了我标签和标签有什么区别，然后我说了和的本质区别是他们的默认display 属性不同，然后他又问了有没有其他的不同，我并不知道。然后他接着问了常见的块级标签和行内标签有哪一些。接着他问了我清除浮动的知识，我只是临时记住了一些清楚浮动的方法，但是还是没有弄懂实际的原理，所以场面也是比较的尴尬。他问了怎么优化网页，说可以怎么做。我不禁一喜，把之前准备的东西背出来，刚说到第一条，减少 http请求，他就问我如何减少 http请求。尴尬，一下子gg，我也想不起来如何减少http请求。后来他看我说不上来就让我继续往下说，我又说了压缩，以及代码精简之类的。然后他又问了具体的，我说了一下，他好像也不是特别满意。我的简历，尼玛，我为什么要写个对于html5有充分的认识！！！我天天又懒得改，每个面试官都要问我这个问题。不过我事先也准备了，就把一些基础的特性说了一下。他说还有别的，然后提醒我缓存之类的，然后就说起来sessionStorage，localStroage之类的，并问了我和cache之间的区别之类的。这里面有个问题他炸了我一下，他说你确定localStorage在本地是不会删除的么，很明显是不会的。然后他问对于缓存请求有没有了解，很明显我并没有什么了解。他又问了我一些对于哪些开源的框架比较熟悉，那也就只有jQuery和bootstrap。他问我对于这些开源框架的更新清不清楚，很明显，宝宝不清楚啊！！！然后他问了一系列图标改变颜色如何实现，实现鼠标挪上去，就改变颜色。这个我说用hover改变css 属性，但他应该是质疑这样的做法吧。后来他又说道bootstrap其实有这样的实现，其实我好像也看到过，但是我也没关注过是如何实现的，真是悲剧。接着他问了js的问题。首先问了一下事件流，这个地方我说错了，事件流应该是补货，处理，冒泡。我把顺序说反了，反正事件流还问了详细的问题，但是我对这个并不是特别了解，所以说的也是不好的。后来出了一个js的题目，如何实现像trim一样去掉两端的空白，我用js写了一下，里面有很多问题，具体就是不说了。后来他提示说是用正则表达式，我说我只会python的，然后他说可以。但是宝宝也写不出来啊，然后他说那你就说下原理吧。然而我并不知道如何做，然后就罢了。 第二个面试官就长得更像程序员了，直接穿个拖鞋就过来了。他是直接让我写代码的，第一题如何实现三列布局，两边各100px，中间自动拓展，我说了用float或者css3的新属性。他直接让我写代码了，然后就写一写，估计也不太对。第二个，他说ie和chrome等绑定的事件的方法不同，如何写一个函数进行不同的处理。这一题我并不知道如何区分，所以也就没写。第三题，他说有没有做过移动端的开发，我说没有。然后我就老实说了，其实自己并没有接触太多的前端。然后她说也看了我简历没什么前端的经历之类的，然后就是说说，然后就没了。 总结一下，这次面试经历讲道理并不是特别困难的。前端的书我也是看了好几本，但其实并没有什么特别的意思，还是做项目成长的比较快。所以，赶紧实习，实际参与项目对于我来说实在是太重要了。

html语义话 img标签alt属性和title属性的区别 alt属性是图片在因浏览器兼容、加载失败活着地址出错等原因无法显示为浏览用户所做的代替语言，其性质为图片的代替；而title属性是表达该图片的一些额外信息，其性质为一种备注或注释，鼠标过去显示该文字。 css布局 常见的布局有四种：表格布局，浮动布局，css框架，flexbox 两列布局，三列布局可以由浮动来实现 css3已经实现了多列布局，主要属性包括 column-count column-gap column-rule-style column-rule-width column-rule-color column-rule column-span column-width div{ -webkit-column-count: 3; Chorome, Safari, Opera -moz-column-count :3; Firefox -column-count:3; } 清除浮动的知识 在浮动元素后面增加标签 在浮动元后面增加一个清楚浮动层： ajax 基本实现步骤 1、创建XMLHttpRequest对象 2、使用XMLHttpRequest对象打开一个连接，制定连接方式<post/get> 和链接地址以及是否同步 3、设置请求的头部（请求的类型和请求的编码格式） 4、设置回调函数 5、发送请求 6、更新页面显示 XMLHttpRequest状态码： 0 uninitialized 初始化状态，XMLHttpRequest已经被创建或者重置 1 open open 方法已经调用，但是send 方法还没有调用，还没有发送请求 2 sent send方案已经发送，请求已经发送到服务器，但是还没有接受到请求 3 receiving 所有响应头已经接受到，响应体开始接受，但没有接受完成 4 loaded 请求已经完全接受 取消a链接默认跳转行为 href属性设置为javascript:void(0) 水平垂直居中 居中文告中的字句：text-align;center 对于div：margin: 0 auto

行内元素有哪些？块级元素有哪些？CSS的盒模型？ 行内元素：a b br i span input select 块级元素：div p h1 h2 h3 h4 form ul css盒模型：content border margin padding 前端页面由哪三层构成，分别是什么，作用是什么？ 结构层：主要指DOM节点：HTML/XHTML 样式层：主要指页面渲染：CSS 脚本层：主要指页面动画效果：JS/AS CSS引入的方式有哪些?link和@import的区别是？ 内联 内嵌 外链 导入 区别：同时加载 css选择符号有哪些 标签选择符 类选择符 ID选择符 标签上title和alt属性的区别是什么？ alt当图片不显示用文字代表 title为该属性提供信息 什么是语义话的HTML？ 直观的认识标签，对于搜索引擎抓取有好处 清除浮动的几种方式以及优缺点： 1 使用空标签清除浮动 clear:both（理论上可以清楚任何标签，缺点增加无意义的标签） 2 使用overflow:auto 3 使用afert伪元素清除浮动 IE和标准下有哪些兼容性的写法 var ev = ev || window.event document.documentElement.clientWidth || document.body.clientWidth var target = ev.srcElement || ev.target 闭包就是能够读取其他函数内部变量的函数 添加，插入，替换，删除，到某个节点的方法 obj.appendChildl() obj.innersetBefore() obj.replaceChild obj.removeChild