前言有人说，如果你懂得浏览器的工作原理，你就能解决80%的前端难题。是的，了解浏览器的工作原理，有助于你的工作；而了解TCP/IP、HTTP等网络协议，更是对你未来的职业发展大有裨益。下面，我总结了4

[本文已经授权掘金开发者社区公众号独家使用，包括但不限于编辑、标注原创等权益。] 1. 查看元素伪类 css 样式 例如我想查看元素触发 hover 时的 css 样式。先选中该元素，然后按下图操作： 2. 临时增删元素 class 3. document.body.conte…

一个普通的网页，浏览器在渲染前需要先构建 DOM（document object model） 和 CSSOM (css object model） 树。 转换：浏览器从磁盘或网络读取 HTML 的原始字节，并根据文件的指定编码将它们转换成各个字符。 令牌化： 浏览器将字符串转…

[实践系列] 主要是让我们通过实践去加深对一些原理的理解。 有兴趣的同学可以关注 [实践系列] 。 求star求follow~ 全称 Domain Name System ,即域名系统。 简单的说,通过域名,最终得到该域名对应的IP地址的过程叫做域名解析（或主机名解析）。 有d…

正巧我多年一直在收集各种浏览器的资料和趣闻，就让我们来看下浏览器内核到底是什么，以及难度如何。 在IT界的洪荒年代（1992年），人们在互联网上还是只能看黑白屏幕上一行又一行的字符的时候，伊利诺斯州大学（NCSA）的马克·安德森 就突发奇想的搞出一个名为 Mosaic 的浏览器…

有过面试经验的同学应该都被问过浏览器兼容性的问题，对于面试官的问题，常常猝不及防，因为通常他们都是这么问的。"来谈谈浏览器兼容的问题吧"，"你对浏览器的兼容性有了解过吗"，那么如何才是我们正确回答这个问题的姿势呢。 在CSS3还没有成为真正的标准时，浏览器厂商就开始支持这些属性…

开发最重要的环节之一就是调试，web端的开发和调试工具没有比chrome更优秀的了，下面就讲讲怎么通过chrome的开发者工具对网站进行迭代、调试和分析。 调试的原理很简单，找到想要调试的文件，打上断点，一路step+分析直到找到自己想要的。它的难点在于调试哪个文件、监听哪些参…

描素: 当ie6及更低版本浏览器在解析浮动元素时会错误的把浮动边边距（margin）加倍显示。 描素：在ie6以及以下版本中解析百分比时会四舍五入方式计算从而导致50%加50%大于100%的情况。（也会受系统影响） ie：document.idname 或者 document.…

如果你用Chrome调试工具，还是停留在console阶段，赶紧来学习一波吧，绝对是满满的干货，让你效率UpUP。 本文侧重点就是关于Chrome DevTools。通过梳理Chrome DevTools 中的小技巧，这些技巧可以帮我们节省很多的时间，直接提升工作效率！ 上面是…