HTML事件机制

我在看cnblog上的一篇有关前端面试的博文的时候,发现里面有一道很有研究价值的题目,是这样说的:

查看全文

jQueryAPI整理

首发于2018年5月8日,API整理自用。
现在Github已经移除了jQuery,前端框架现在也这么流行,以现在的眼光看jQuery确实是用途减少了很多。
不过它的Sizzle引擎设计、API设计真的是艺术品级别的,而且很多小项目旧项目还是要继续用,所以写个博文把常用API整理下,力求简短易懂。

查看全文

HistoryAPI介绍

HistoryAPI是HTML5的新特性,它是浏览器提供给网页的一组接口,即BOM特性。它用于在不重载页面的情况下修改页面url,或是向浏览器的历史记录中添加访问记录。
绝大多数现代浏览器都支持HistoryAPI,在这里可以查看到它的兼容性,如果浏览器不支持,仍然可以使用History.js垫片库来模拟实现。

查看全文

object、class、prototype和__proto__

首发于2018年5月7日,最后更新于2019年4月9日。
记录关于JS面向对象的相关细节。
初学者建议先去看JS基础教程ES6手册。部分内容来自网络和MDN。

查看全文

浏览器的跨域策略与CORS方案

本文的内容部分参考自阮一峰博客的一篇博文MDN
当然添加了很多补充说明,有的是来自互联网上各从业者的博客。另外我自己为了验证,做了不少测试,以及实践了服务器端的CORS改造。
不得不说PHP确实是为了Web开发设计的一门语言,在添加请求头、获取请求参数等方面使用起来非常方便。
有关跨域访问的其他解决方案可以参考阮一峰的这篇博文,有关CORS的兼容性,可以在CanIUse上看到

查看全文

FetchAPI介绍

面试的时候,经常会遇到要求应试者手写ajax,即使用原生JS代码自行构建XHR,然后绑上回调、传入参数,最后发送出去。
实际项目中,肯定不会使用原生XHR来发送ajax,因为写法还是功能都很简陋。工程中常见的几种ajax请求方式:使用jQuery框架的$.get( )$.ajax( )等,或者使用专用的ajax库例如axios等。随着前端技术的发展,浏览器现在给我们提供了FetchAPI,用于以简单优雅的方式发起浏览器原生支持的ajax请求。
本篇文章参考了网上的一些博文和MDN,另外可以在这里查看Fetch的兼容性。注意FetchAPI的兼容性较差,IE全线不支持,甚至一些现代浏览器也只有新版本支持。

查看全文

JS标准库备忘

本文写于2018年4月11日,于2019年5月15日发布在博客上。
JS标准库的内容可以在MDN阮一峰的网道教程上找到,其中一部分是ES2017以及更新版本的语言特性。
因为日常使用可能会记不清某些方法的用法(例如Object一类)和具体细节,因此写一篇JS标准库备忘录给自己查阅。

查看全文

AMD、CommonJS和ES6的模块化方式

CommonJS是用于Node.js上的JS模块化规范,而AMD是用于浏览器端的模块化异步加载约定。
如果js代码运行在服务器上,这些代码很有可能要承担并发访问并做一些资源的处理工作,所以CommonJS的瓶颈是磁盘。这种场合下,相同或相似功能的代码通常要被执行多次,因此CommonJS的实现中具备缓存的功能。
而AMD是在用户的浏览器上随网页一起加载的,它的瓶颈是带宽。AMD的实现了异步加载,使得用户的网页可以渐进地载入,这能提供更好的用户体验,适合在浏览器上使用。
本文的CommonJS部分主要参照于《深入浅出Node.js》一书。

查看全文