浏览器端存储数据，cookie、sessionStorage、localStorage，这里重点说说localStorage的实际应用。 cookie、sessionStorage、localStorage 三者都是在浏览器端存储的数据，均同源，区分域。 cookiecookie，默认各种浏览器都支持；容量较小、约4K；每次http请求时、浏览器都会把自身存的cookies发送到服务器，并且在浏览器和服务器之间来回传递，造成带宽浪费；cookie数据可以设置path、限制该cookie只属于 ...

紧接上一篇中，对js模块化编程里的面向对象编程的写法、改进为自执行函数的写法。 本文所介绍的完整js代码：github 面向对象写法上一篇中，面向对象的写法如下： 123456789101112//面向对象写法var Func={ func1:function(){ console.log('func1'); }, func2:function(){ console.log('func2');
...

JS面向对象编程的写法习惯，给JS功能模块化的管理带来非凡好处。明确清晰的代码分块分类，使得在日常使用修改、团队合作开发中更加得心应手，实在美妙。 通常，一个较大的JS功能模块，我们可以独立出一个js文件；在需要使用的时候，通过JS模块化工具require.js来进行管理加载。详情请参考之前写过的一篇学习文章 require.js 实例入门 ，这里就不重复了。 函数封装然而，在一个较长的JS文件中，通常也存在着很多小小的功能模块，以往一般的做法是：不断地定义了许许多多的 function f ...

考虑到项目近期的需要，提前学习了一下 gulp 插件之 less编译、rev-append添加版本号，自然是边学边弄个小项目来实践的啦！ cnpm 淘宝 NPM 镜像以前一直是通过 npm 来安装插件的，此做法是直接从国外服务器下载插件的，受网络影响大。于是，淘宝便搞了个 cnpm ： “这是一个完整 npmjs.org 镜像，你可以用此代替官方版本(只读)，同步频率目前为 10分钟 一次以保证尽量与官方服务同步。” 详细说明移步官网：淘宝镜像官网：淘宝 NPM 镜像 安装 cnpm： ...

考虑到后续的应用需要，特将JS面向对象的东西再复习梳理重新认识一遍。 JS 创建对象的方式有不少，目前主要受推重的方式是组合模式（构造函数模式结合原型模式）。下面分别介绍、层层推进笔记。 1早期创建对象new模式实例化一个对象，然后用点号.给实例赋予属性、方法。 12345678var person=new Object();// var person={}; //或创建一个空对象person.name="guo";person.age="20";person.jop= ...

之前在项目中用 HTML5 提供的 XHR2 草草地临时性解决了一个 ajax 的跨域问题。其实跨域这东东还是大有乾坤的，今天来深入扒一扒。 1 什么是跨域同源策略可以一定程度上保证web的安全。跨域，简单地说：由于同源策略的限制，a.com 域名下无法跟 b.com 域名进行数据的请求交互。 比如，我在一个合法的网站A上注册了个人信息；注册完了之后，我又去一家不安全的网站B去转转。万一恶意网站B、跑去合法网站A、盗取了我的个人信息……后果是不是很严重的样子？所以同源策略还是为咱用户着想的。 ...

对于jquery插件，一直以来，更多地只是使用别人的插件、修改别人的插件。今天就费点功夫，自己来折腾一下自定义的jquery插件编写，重点是：jquery 对象级别的插件（即封装方法插件）。 从步步折腾到最终编写出第一个 jquery 插件 demo，中间的确碰了不少的壁。本文就主要记录下成功之后、编写 jquery 对象级别的插件的顺顺步奏。 jquery 插件类别 选择器插件，$.widget()；极少用，略。 类级别插件（封装函数插件），较少用。通过 $.extend() 来给 jQu ...

随着项目的壮大，js 通用功能代码块越来越多，复制粘贴js块、多引入一个又一个的 <script></script> 终究觉得这些笨拙得无法满足当前的需要了。 require.js 相信能帮上这个忙。 require.js 的知识点不多，官网、同行高手的博文都已经说得好详细了。个人学习膜拜后，决定写下自己的第一个 require.js 实例小 demo 的过程，实用成果。 主要参考：RequireJS 中文网阮一峰 Javascript模块化编程 开始前的准备下载 r ...

在做一些页面效果、提升用户体验等需求时，常常需要找准该效果的触发时机，而 BOM窗口 正是一个很好的触发基准点。有必要对其进行详细的整理。 jquery 的BOM窗口位置大小jquery的高度/宽度/滚动/偏移量 窗口：浏览器可视区域的高度： $(window).height();浏览器可视区域的宽度： $(window).width(); 文档：页面文档高度： $(document).height();页面文档宽度： $(document).width(); 滚动：滚动条已滚动的上距 ...