zepoch's site

什么是 NPM NPM（全称Node Package Manager，即node包管理器） 是Node.js默认的、以JavaScript编写的软件包管理系统 npm 来分享和使用代码已经成了前端的标配 官网： https://www.npmjs.com npm被全球超过1100万开发人员所依赖 拥有超过一百万个软件包，是世界上最大的软件注册表 安装NPM npm是Node.js默认的软件包管理系统 安装完毕node后，会默认安装好npm npm本身也是基于Node.js开发的软件 下载Node: http://nodejs.cn NPM 的使用 123456789101112131415161718192021222324npm -v #通过查看版本，看npm是否安装成功npm install <Module Name> #使用 npm 命令安装模块npm install <Module Name> -g #可以直接在命令行里使用npm list -g #查看所有全局安装的模块npm list vue...

版本控制 版本控制（Revision control）是一种在开发的过程中用于管理我们对文件、目录或工程等内容的修改历史，方便查看更改历史记录，备份以便恢复以前的版本的软件工程技术。 实现跨区域多人协同开发 追踪和记载一个或者多个文件的历史记录 组织和保护你的源代码和文档 统计工作量 并行开发、提高开发效率 跟踪记录整个软件的开发过程 减轻开发人员的负担，节省时间，同时降低人为错误 简单说就是用于管理多人协同开发项目的技术。 没有进行版本控制或者版本控制本身缺乏正确的流程管理，在软件开发过程中将会引入很多问题，如软件代码的一致性、软件内容的冗余、软件过程的事物性、软件开发过程中的并发性、软件源代码的安全性，以及软件的整合等问题。 无论是工作还是学习，或者是自己做笔记，都经历过这样一个阶段！我们就迫切需要一个版本控制工具！ 常见的版本控制工具 主流的版本控制器有如下这些： Git SVN（Subversion） CVS（Concurrent Versions System） VSS（Microsoft Visual SourceSafe） TFS（Team...

函数内 this 的指向 这些 this 的指向，是当我们调用函数的时候确定的。 调用方式的不同决定了this 的指向不同一般指向我们的调用者. 1. 普通函数 this 指向window 1234function fn() { console.log('普通函数的this' + this);}window.fn(); 2. 对象的方法 this指向的是对象 o 123456var o = { sayHi: function() { console.log('对象方法的this:' + this); }}o.sayHi(); 3. 构造函数 this 指向 ldh 这个实例对象 原型对象里面的this 指向的也是 ldh这个实例对象 1234function Star() {};Star.prototype.sing = function() {}var ldh = new...

原生AJAX 1.1 AJAX 简介 AJAX 全称为Asynchronous JavaScript And XML，就是异步的 JS 和 XML。 通过AJAX 可以在浏览器中向服务器发送异步请求，最大的优势：无刷新获取数据。 AJAX 不是新的编程语言，而是一种将现有的标准组合在一起使用的新方式。 1.2 XML 简介 XML 可扩展标记语言。 XML 被设计用来传输和存储数据。 XML 和 HTML 类似，不同的是 HTML 中都是预定义标签，而 XML 中没有预定义标签， 全都是自定义标签，用来表示一些数据。 比如说我有一个学生数据： name = "孙悟空" ; age = 18 ; gender = "男" ; 用 XML 表示： 12345<student><name>孙悟空</name><age>18</age><gender>男</gender></student> 用 JSON...

jQuery 入门 jQuery 概述 JavaScript 库 JavaScript库：即 library，是一个封装好的特定的集合(方法和函数)。从封装一大堆函数的角度理解库，就是在这个库中，封装了很多预先定义好的函数在里面，比如动画animate、hide、show，比如获取元素等。 简单理解∶就是一个JS文件，里面对我们原生js代码进行了封装，存放到里面。这样我们可以快速高效的使用这些封装好的功能了。 比如jQuery，就是为了快速方便的操作DOM，里面基本都是函数(方法)。 常见的 JavaScript 库 jQuery Prototype YUI Ext JS 移动端的 zepto jQuery 的概念 jQuery 是一个快速、简洁的JavaScript库，其设计的宗旨是“write Less, Do More”，即倡导写更少的代码，做更多的事情。 j 就是 JavaScript；Query查询;意思就是查询 js，把 js 中的DOM 操作做了封装，我们可以快速的查询使用里面的功能。 jQuery 封装了 JavaScript 常用的功能代码，优化了...

PC 端网页特效 元素偏移量 offset 系列 offset 概述 offset 翻译过来就是偏移量，我们使用 offset 系列相关属性可以动态的得到该元素的位置（偏移）、大小等 获得元素距离带有定位父元素得到位置 获得元素自身的大小（宽度高度） 注意：返回的数值都不带单位 常用属性 offsetTop offsetLeft 以带有定位的父亲为准 offsetParent 返回带有定位的父亲，否则返回 body offsetWidth offsetHeight 元素可视区 client 系列 概述 client 翻译过来就是客户端，我们使用 client 系列的相关属性来获取元素可视区的相关信息。通过client系列的相关属性可以动态的得到该元素的边框大小、元素大小等。 元素滚动 scroll 系列 概述 scroll 翻译过来就是滚动的，我们使用 scroll 系列的相关属性可以动态的得到该元素的大小、滚动距离等 动画函数封装 动画实现原理 通过定时器 setInterval()...

高级事件 注册事件 给元素添加事件成为注册事件或者绑定事件 传统方式和方法监听注册方式 传统注册 利用 on 开头的事件 onclick 1<button onclick = alert("hi~")></button> 1btn.onclick = function(){} 特点：注册事件的唯一性 同一元素同一事件只能设置一个处理函数，最后注册的处理函数将会覆盖前面注册的处理函数 方法监听注册方式 w3c 标准 推荐方式 addEventListener() 是一个方法 1addEventListener(type, listener[, useCapture]) type 事件类型字符串，比如click mouseover 注意这里不要带on listener 事件处理函数，事件发生时，会调用该监听函数 可选参数，是一个布尔值，默认是false attachEvent 事件监听方式 ie9 之前的版本支持 生产版本一般不使用 IE9 之前的 IE...

关于 API API Application Programming Interface， 应用程序编程接口，是一些预先定于的函数，目的是提供应用程序与开发人员基于某硬件或软件得以访问一组例程的能力，而又无需访问源码，或理解内部工作机制的细节。 API是给程序员提供的某种工具，以便能更轻松的实现想要完成的功能 WEB API 是浏览器提供的一套操作浏览器功能和页面元素的API（BOM和DOM），MDN API: https://developer.mozilla.org/zh-CN/docs/Web/API DOM DOM 简介 什么是 DOM 文档对象模型（Document Object Model，简称 DOM），是W3C组织推荐的处理可拓展标记语言（HTML 或者 XML）的标准编程接口 DOM树 W3C已经定义了一系列的DOM接口，通过这些 DOM 可以改变网页的结构和样式 文档：一个页面就是一个文档，DOM中使用 document 表示 元素：页面中的所有标签都是元素，DOM中使用 element...

...

代码规范 1. 概述 欢迎使用品优购代码规范， 这个是我借鉴京东前端代码规范，组织的品优购内部规范。旨在增强团队开发协作、提高代码质量和打造开发基石的编码规范， 以下规范是团队基本约定的内容，必须严格遵循。 HTML规范 基于 W3C、苹果开发者 等官方文档，并结合团队业务和开发过程中总结的规范约定，让页面HTML代码更具语义性。 图片规范 了解各种图片格式特性，根据特性制定图片规范，包括但不限于图片的质量约定、图片引入方式、图片合并处理等，旨在从图片层面优化页面性能。 CSS规范 统一规范团队 CSS 代码书写风格和使用 CSS 预编译语言语法风格，提供常用媒体查询语句和浏览器私有属性引用，并从业务层面统一规范常用模块的引用。 命名规范 从 目录、图片、HTML/CSS文件、ClassName 的命名等层面约定规范团队的命名习惯，增强团队代码的可读性。 2. HTML 规范 DOCTYPE 声明 HTML文件必须加上 DOCTYPE 声明，并统一使用 HTML5 的文档声明： 1<!DOCTYPE...