web進-优快云博客

原创 gulp 入门

第1章gulp简介1.1 gulp是什么？gulp是前端开发过程中一种基于流的代码构建工具，是自动化项目的构建利器；她不仅能对网站资源进行优化，而且在开发过程中很多重复的任务能够使用正确的工具自动完成；使用她，不仅可以很愉快的编写代码，而且大大提高我们的工作效率。gulp是基于Nodejs的自动任务运行器，她能自动化地完成 javascript、coffee、sass、less、

2016-08-26 22:01:08 615

原创 canvas （笔记）高级篇

3.1. 变换Canvas 绘图中支持矩阵变换功能. 其中涉及的常用方法有CanvasRenderingContext2D.transform()CanvasRenderingContext2D.scale()CanvasRenderingContext2D.translate()CanvasRenderingContext2D.rotate()CanvasRenderingConte

2016-08-22 09:34:18 479

原创 javaScript笔记（二十九）Ajax

Ajax2005年Jesse James Garrett发表了一篇文章，标题为：“Ajax：A new Approach to Web Applications”。他在这篇文章里介绍了一种技术，用他的话说，就叫：Ajax，是Asynchronous JavaScript + XML的简写。这种技术能够想服务器请求额外的数据而无须卸载页面(即刷新)，会带来更好的用户体验。一时间，席卷全球。一

2016-08-22 09:23:27 425

原创 javaScript笔记（二十八） JSON

JSONJSON是JavaScript的一个严格的子集，利用JavaScript中的一些模式来表示结构化数据。一．JSON语法JSON和XML类型，都是一种结构化的数据表示方式。所以，JSON并不是JavaScript独有的数据格式，其他很多语言都可以对JSON进行解析和序列化。JSON的语法可以表示三种类型的值：1.简单值：可以在JSON中表示字符串、数值、布尔值和null。

2016-08-22 09:16:15 336

原创 javaScript笔记（二十七） XPath

XPathXPath是一种节点查找手段，对比之前使用标准DOM去查找XML中的节点方式，大大降低了查找难度，方便开发者使用。但是，DOM3级以前的标准并没有就XPath做出规范；直到DOM3在首次推荐到标准规范行列。大部分浏览器实现了这个标准，IE则以自己的方式实现了XPath。一．IE中的XPath在IE8及之前的浏览器，XPath是采用内置基于ActiveX的XML DOM

2016-08-19 20:46:30 555

原创 javaScript笔记（二十l六）XML

XML随着互联网的发展，Web应用程序的丰富，开发人员越来越希望能够使用客户端来操作XML技术。而XML技术一度成为存储和传输结构化数据的标准。一．IE中的XML在统一的正式规范出来以前，浏览器对于XML的解决方案各不相同。DOM2级提出了动态创建XML DOM规范，DOM3进一步增强了XML DOM。所以，在不同的浏览器实现XML的处理是一件比较麻烦的事情。1.创建XML

2016-08-19 20:37:42 310

原创 javaScript笔记（二十五） Cookie与存储

Cookie与存储随着Web越来越复杂，开发者急切的需要能够本地化存储的脚本功能。这个时候，第一个出现的方案：cookie诞生了。cookie的意图是：在本地的客户端的磁盘上以很小的文件形式保存数据。一．Cookiecookie也叫HTTP Cookie，最初是客户端与服务器端进行会话使用的。比如，会员登录，下次回访网站时无须登录了；或者是购物车，购买的商品没有及时付款，过两天

2016-08-19 20:34:01 442

原创面试题（一） Quirks模式是什么？它和Standards模式有什么区别

从IE6开始，引入了Standards模式，标准模式中，浏览器尝试给符合标准的文档在规范上的正确处理达到在指定浏览器中的程度。在IE6之前CSS还不够成熟，所以IE5等之前的浏览器对CSS的支持很差， IE6将对CSS提供更好的支持，然而这时的问题就来了，因为有很多页面是基于旧的布局方式写的，而如果IE6 支持CSS则将令这些页面显示不正常，如何在即保证不破坏现有页面，又提供新的渲染机制呢？

2016-08-17 22:36:13 923

原创 javaScript笔记（二十四）错误处理与调试

错误处理与调试JavaScript在错误处理调试上一直是它的软肋，如果脚本出错，给出的提示经常也让人摸不着头脑。ECMAScript第3版为了解决这个问题引入了try...catch和throw语句以及一些错误类型，让开发人员更加适时的处理错误。一．浏览器错误报告随着浏览器的不断升级，JavaScript代码的调试能力也逐渐变强。IE、Firefox、Safari、Chrome和

2016-08-17 22:34:04 493

原创 javaScript笔记（二十三）表单处理

表单处理为了分担服务器处理表单的压力，JavaScript提供了一些解决方案，从而大大打破了处处依赖服务器的局面。一．表单介绍在HTML中，表单是由元素来表示的，而在JavaScript中，表单对应的则是HTMLFormElement类型。HTMLFormElement继承了HTMLElement，因此它拥有HTML元素具有的默认属性，并且还独有自己的属性和方法： H

2016-08-17 22:27:49 354

原创 javaScript笔记（八） Function类型

Function类型在ECMAScript中，Function(函数)类型实际上是对象。每个函数都是Function类型的实例，而且都与其他引用类型一样具有属性和方法。由于函数是对象，因此函数名实际上也是一个指向函数对象的指针。一．函数的声明方式1.普通的函数声明functionbox(num1, num2) {return num1+ num2;} 2.

2016-08-16 21:58:09 324

原创 canvas （笔记）中级篇

canvas 中级篇2.1. 绘制形状绘制图形不仅仅是利用线条来实现绘图, 还可以有快捷的绘制图形的办法绘制矩形绘制圆弧2.1.1. 绘制矩形绘制矩形的方法CanvasRenderingContext2D.strokeRectCanvasRenderingContext2D.fillRectCanvasRenderingContext2D.rect注意: rec

2016-08-16 12:03:32 373

原创 javaScript笔记（二十二）事件绑定及深入

事件绑定及深入事件绑定分为两种：一种是传统事件绑定(内联模型，脚本模型)，一种是现代事件绑定(DOM2级模型)。现代事件绑定在传统绑定上提供了更强大更方便的功能。一．传统事件绑定的问题传统事件绑定有内联模型和脚本模型，内联模型我们不做讨论，基本很少去用。先来看一下脚本模型，脚本模型将一个函数赋值给一个事件处理函数。var box = document.getElementB

2016-08-16 11:35:49 285

原创 javaScript笔记（二十一）事件对象

事件对象JavaScript事件的一个重要方面是它们拥有一些相对一致的特点，可以给开发提供更多的强大功能。最方便和强大的就是事件对象，他们可以帮你处理鼠标事件和键盘敲击方面的情况，此外还可以修改一般事件的捕获/冒泡流的函数。一．事件对象事件处理函数的一个标准特性是，以某些方式访问的事件对象包含有关于当前事件的上下文信息。事件处理三部分组成：对象.事件处理函数=函数。例如：单击

2016-08-16 11:26:33 307

原创 canvas （笔记）基础篇

canvas 基础篇1.1. 什么是 Canvascanvas 是 HTML5 提供的一个用于展示绘图效果的标签. canvas 原意画布, 帆布. 在 HTML 页面中用于展示绘图效果. 最早 canvas 是苹果提出的一个方案, 今天已经在大多数浏览器中实现.canvas 英 ['kænvəs] 美 ['kænvəs] 帆布画布1.1.1. canvas 的基本

2016-08-14 23:34:48 410

原创 javaScript笔记（二十）事件入门

事件入门JavaScript事件是由访问Web页面的用户引起的一系列操作，例如：用户点击。当用户执行某些操作的时候，再去执行一系列代码。一．事件介绍事件一般是用于浏览器和用户操作进行交互。最早是IE和Netscape Navigator中出现，作为分担服务器端运算负载的一种手段。直到几乎所有的浏览器都支持事件处理。而DOM2级规范开始尝试以一种复合逻辑的方式标准化DOM事件。IE9、F

2016-08-14 22:31:47 231

原创 javaScript笔记（十九）动态加载脚本和样式

动态加载脚本和样式一．元素位置上一章已经通过几组属性可以获取元素所需的位置，那么这节课补充一个DOM的方法：getBoundingClientRect()。这个方法返回一个矩形对象，包含四个属性：left、top、right和bottom。分别表示元素各边与页面上边和左边的距离。var box = document.getElementById('box');//获取元素a

2016-08-14 22:25:05 583

原创 javaScript笔记（十八） DOM元素尺寸和位置

DOM元素尺寸和位置一．获取元素CSS大小1.通过style内联获取元素的大小var box = document.getElementById('box');//获取元素box.style.width;//200px、空box.style.height;//200px、空 PS：style获取只能获取到行内style属性的CSS样式中的宽和高，如果有获取；如果没有则返

2016-08-14 22:22:31 275

原创 javaScript笔记（十七） DOM操作表格及样式

DOM操作表格及样式DOM在操作生成HTML上，还是比较简明的。不过，由于浏览器总是存在兼容和陷阱，导致最终的操作就不是那么简单方便了。本章主要了解一下DOM操作表格和样式的一些知识。一．操作表格标签是HTML中结构最为复杂的一个，我们可以通过DOM来创建生成它，或者HTML DOM来操作它。(PS：HTML DOM提供了更加方便快捷的方式来操作HTML，有手册)。//需要操

2016-08-14 22:06:42 491

原创 javaScript笔记（十六） DOM进阶

DOM进阶 DOM自身存在很多类型，在DOM基础课程中大部分都有所接触，比如Element类型：表示的是元素节点，再比如Text类型：表示的是文本节点。DOM也提供了一些扩展功能。一．DOM类型DOM基础课程中，我们了解了DOM的节点并且了解怎样查询和操作节点，而本身这些不同的节点，又有着不同的类型。 DOM类型 1.Node类型Node

2016-08-11 22:25:57 310

原创 javaScript笔记（十五）DOM基础

DOM基础DOM（Document Object Model）即文档对象模型，针对HTML和XML文档的API（应用程序接口）。DOM描绘了一个层次化的节点树，运行开发人员添加、移除和修改页面的某一部分。DOM脱胎于Netscape及微软公司创始的DHTML（动态HTML），但现在它已经成为表现和操作页面标记的真正跨平台、语言中立的方式。一．DOM介绍DOM中的三个字母，D（文档

2016-08-11 22:06:58 284

原创 javaScript笔记（十四）浏览器检测

浏览器检测由于每个浏览器都具有自己独到的扩展，所以在开发阶段来判断浏览器是一个非常重要的步骤。虽然浏览器开发商在公共接口方面投入了很多精力，努力的去支持最常用的公共功能；但在现实中，浏览器之间的差异，以及不同浏览器的“怪癖”却是非常多的，因此客户端检测除了是一种补救措施，更是一种行之有效的开发策略。一．navigator对象navigator对象最早由Netscape N

2016-08-10 16:57:13 1985

原创 javaScript笔记（十三） BOM

BOMBOM也叫浏览器对象模型，它提供了很多对象，用于访问浏览器的功能。BOM缺少规范，每个浏览器提供商又按照自己想法去扩展它，那么浏览器共有对象就成了事实的标准。所以，BOM本身是没有标准的或者还没有哪个组织去标准它。一．window对象BOM的核心对象是window，它表示浏览器的一个实例。window对象处于JavaScript结构的最顶层，对于每个打开的窗口，系统都会自动

2016-08-10 16:46:39 388

原创代码题

看到一个代码的笔试题，难度不大，但是也需要思考一下。题目如下：//编写一个交错合并列表元素的函数。例如给定两个列表为[a,B,C]和[1,2,3],函数返回[a,1,B,2,C,3]题目中[a,B,C]包含的字母在代码中会解析成变量，因此我们可以理解为是["a","B","C"]代码如下：（可能会有简单的方法，但就目前本人的水平提供的代码如下）ps：因为比较简单，单看每

2016-08-08 22:45:43 495

最开始接触js的时候，总是接触一些属性和方法，后来就是一些DOM对象和BOM的操作方法。当时总觉得没什么意思，都是一些记忆性的东西，更深接触了js以后才发现自己当时是多么的幼稚，只是因为自己懂的太少。js的精髓就在这些基础知识当中，面向对象、闭包、作用于、原型链、作用域链等等的一些内容哪一样都离不开这些基础的应用，狠狠的嘲笑自己一番吧······ 不积跬步，无以至千里。凡事一定要慢慢积累，不能眼高

2016-08-08 22:19:59 642

原创 javaScript笔记（十二）匿名函数和闭包

匿名函数和闭包匿名函数就是没有名字的函数，闭包是可访问一个函数作用域里变量的函数。声明：本节内容需要有面向对象和少量设计模式基础一．匿名函数 //普通函数function box() {//函数名是boxreturn 'Lee';} //匿名函数function () {//匿名函数，会报错return 'Lee';} //通过表

2016-08-08 22:15:29 224

原创 javaScript笔记（十一）面向对象与原型

面向对象与原型 ECMAScript有两种开发模式：1.函数式(过程化)，2.面向对象(OOP)。面向对象的语言有一个标志，那就是类的概念，而通过类可以创建任意多个具有相同属性和方法的对象。但是，ECMAScript没有类的概念，因此它的对象也与基于类的语言中的对象有所不同。一．学习条件在JavaScript视频课程第一节课，就已经声明过，JavaScript课程需要大量的基

2016-08-08 22:05:48 230

原创 javaScript笔记（十一）内置对象

内置对象 ECMA-262对内置对象的定义是：“由ECMAScript实现提供的、不依赖宿主环境的对象，这些对象在ECMAScript程序执行之前就已经存在了。”意思就是说，开发人员不必显示地实例化内置对象；因为它们已经实例化了。ECMA-262只定义了两个内置对象：Global和Math。一．Global对象Global(全局)对象是ECMAScript中一个特别的

2016-08-08 21:59:31 409

原创 javaScript笔记（十）基本包装类型

基本包装类型为了便于操作基本类型值，ECMAScript提供了3个特殊的引用类型：Boolean、Number和String。这些类型与其他引用类型相似，但同时也具有与各自的基本类型相应的特殊行为。实际上，每当读取一个基本类型值的时候，后台就会创建一个对应的基本包装类型的对象，从而能够调用一些方法来操作这些数据。一．基本包装类型概述var box = 'Mr. Le

2016-08-05 22:49:07 217

原创 javaScript笔记（九）变量、作用域及内存

变量、作用域及内存 JavaScript的变量与其他语言的变量有很大区别。JavaScript变量是松散型的(不强制类型)本质，决定了它只是在特定时间用于保存特定值的一个名字而已。由于不存在定义某个变量必须要保存何种数据类型值的规则，变量的值及其数据类型可以在脚本的生命周期内改变。一．变量及作用域1.基本类型和引用类型的值ECMAScript变量可能包含两种不同的数据类型

2016-08-05 22:46:22 312

原创 javaScript笔记（七）正则表达式

正则表达式假设用户需要在HTML表单中填写姓名、地址、出生日期等。那么在将表单提交到服务器进一步处理前，JavaScript程序会检查表单以确认用户确实输入了信息并且这些信息是符合要求的。一．什么是正则表达式正则表达式(regular expression)是一个描述字符模式的对象。ECMAScript的RegExp类表示正则表达式，而String和RegExp都定义了使用

2016-08-04 20:40:03 269

原创 javaScript笔记（六）时间与日期

时间与日期ECMAScript提供了Date类型来处理时间和日期。Date类型内置一系列获取和设置日期时间信息的方法。一．Date类型ECMAScript中的Date类型是在早期Java中java.util.Date类基础上构建的。为此，Date类型使用UTC (Coordinated Universal Time，国际协调时间[又称世界统一时间]) 1970年1月1日

2016-08-04 20:26:39 170

原创 javaScript 笔记（五）对象和数组

第8章对象和数组什么是对象，其实就是一种类型，即引用类型。而对象的值就是引用类型的实例。在ECMAScript中引用类型是一种数据结构，用于将数据和功能组织在一起。它也常被称做为类，但ECMAScript中却没有这种东西。虽然ECMAScript是一门面向对象的语言，却不具备传统面向对象语言所支持的类和接口等基本结构。一．Object类型到目前为止，我们使用的引用类型

2016-08-04 19:58:05 338

原创 javaScript笔记（四）数组和函数

第1章数组1.1 数组的概述1.1.1 为什么学习数组之前学习的数据类型，只能存储一个值。（字符串为一个值）我们想存储多个值的时候可以使用数组。（字符串不方便）比如：存储班级中所有学生的姓名。（[“张三”,“李四”,“王五”]）1.1.2 数组是什么数组是一种数据类型。（把很多数据装入一个盒子中，用的时候在取出来）字面量为[1,2

2016-08-04 12:36:02 344

原创 javaScript笔记（三）数据类型转换和操作符、流程控制

第1章数据类型转换一、转换成字符串类型二、转换成数值类型三、转换成布尔类型1.1 任何简单类型转换成String（三种方法）1.1.1 变量+“” 或者变量+“abc”1.1.2 String(变量)1.1.3 变量.toSting()注意：undefined和null不可以Null和undefined无toString方

2016-08-04 12:31:32 241

原创前端入坑心得

系统的进行前端学习已经有三四个月的时间，从HTML到CSS到javaScript再到移动端开发，现在已经到了面向对象的阶段，越学习越觉得自己在前端的道路上还有很长的距离。现在已经不敢称自己已经前端入门，也许只能说比一般人了解多了一点，能够做出比较炫的页面，添加一些动态效果，可以做出自适应的页面和手机端的页面，再深一层可以模拟从后台获取数据渲染在页面上，能够简单使用一些流行的框架。随着了解的东西

2016-08-04 12:00:07 376

原创 javaScript 笔记（二）变量和数据类型

第1章变量1.1 命名规则驼峰命名规则：getElementById/matherAndFather/aaaOrBbbAndCcc遵从规则：1.变量命名必须以字母或是下标符号”_”或者”$”为开头。2.变量名长度不能超过255个字符。3.变量名中不允许使用空格，首个字不能为数字。4.不用使用脚本语言中保留的关键字及保留符号作为变量名。

2016-08-02 23:09:42 244

原创 javaScript 笔记（一）js概述

1.1 JS作用1．验证表单（以前的网速慢）2．页面特效（PC端的网页效果）3．移动端（移动web和app）4．异步和服务器交互（AJAX）5．服务端开发（nodejs）1.2 浏览器工作原理1.3 弱类型脚本语言（解释型语言，解析执行与编译执行）1.3.1 解析执行与编译执行编译执行：把代码编译成CPU认识的语言(文件)

2016-08-02 23:04:17 547

原创记录转行学习前端的历程（缘由）

注册优快云已经有几年了，我一个文科生为什么会关注计算机相关技术呢？说起来还应该感谢我家胖子～初次接触前端还是在11年的时候，那时我还是一枚中学英语老师，那时计算机对我来说就是上网聊天用的，完全没有想过我所见到的、用到的都是怎么实现的。那一年，幸运的是遇到了胖子，因为他我慢慢接触到了计算机的领域，尤其是在说到网页的时候，我觉得觉得好厉害呀，这么炫酷的页面原来是用一个字母做出来的，迫不及待的想要了解

2016-08-02 22:44:47 475

空空如也

空空如也