pxy_Shineyo-CSDN博客

原创 util

util.inheritsutil.inherits(constructor,superConstructor)是一个实现对象间原型继承的函数。示例如下：var util=require('util');function Base(){ this.name='base'; this.base=2016; this.sayHello=function(){ co

2016-03-19 13:51:16 759

原创 HTML5本地存储

Web Storagecookies存储存在的一些问题存储限制：cookie的大小被限制在4KB。带宽：cookie是随HTTP事务一起被发送的，浪费带宽。复杂性：要正确操作cookie是很困难的。 HTML5中提供了一种在客户端本地保存数据的功能，就是Web Storage.Web Storage分为两种sessionStorage将数据保存在session对象中。所谓session,就是

2016-03-16 18:32:50 635

原创离线应用程序

乘坐飞机、手机信号弱、去演讲的时候，可能没有网络，这个时候就可以采用离线应用。离线存储的好处？没网的时候，可以正常访问快速相应页面，不必用多个HTTP占用资源带宽缓存的可以是任何文件本地缓存与浏览器网页缓存的区别本地缓存是为整个Web应用程序服务的，而浏览器的网页缓存只服务于单个网页。任何网页都具有网页缓存，而本地缓存只缓存哪些你指定缓存的网页。搭建离线应用程序 1.服务器配置文件中

2016-03-12 21:05:01 803

原创 Node.js包的管理

Package.jsonpackage.json是CommonJS规定的用来描述包的文件，完全符合规范的package文件应该含有以下字段： name：包的名称，必须是唯一的，由小写英文字母、数字和下划线组成，不能包含空格。 description:包的简要说明。 version:符合语义化版本识别规范的版本字符串。 keywords:关键字数组，通常用于搜索 maintainers:

2016-03-11 20:51:13 778

模块(Module)和包(Package)是Node.js最重要的支柱。对使用者来说，模块和包的区别是透明的，因此经常不作区分。如果要辨析，可以把包理解成实现了某个功能模块的集合，用于发布和维护。创建模块在Node.js中创建一个模块非常简单，因为一个文件就是一个模块，我们要关注的问题仅仅在于如何在其他文件中获得这个模块。Node.js提供了exports和require两个对象，其中exports

2016-03-11 20:48:48 541

原创 Node.js全局对象

或者流程图：Created with Raphaël 2.1.0开始我的操作确认？结束yesno关于序列图语法，参考这儿,关于流程图语法，参考这儿.离线写博客即使用户在没有网络的情况下，也可以通过本编辑器离线写博客（直接在曾经使用过的浏览器中输入write.blog.csdn.net/mdeditor即可。Markdown编辑器使用浏览器离线存储将内容保存在本地。用户写博客的过程中

2016-03-11 20:37:28 691

原创 Web Workers处理线程

什么是worker? 在使用HTML4与Javascript创建出来的Web程序中，所有的处理都是单线程的，如果花费的时间比较长的话，程序界面会长时间处于没有响应的状态。利用HTML5中的Web Workers API,用户很容易的创建在后台运行的线程（worker),将耗时的处理交给后台去执行，大大优化了程序的性能。Worker API new Worker(‘后台处理的JS地址’) 利

2016-03-11 18:33:16 522

原创 Node.js调试工具之node-inspector

大部分基于Node.js的应用都是运行在浏览器中的。强大的调试工具node-inspector是一个完全基于Node.js的开源在线调试工具，提供了强大的调试功能和友好的用户界面。1.安装使用npm install -g node-inspector命令安装node-inspector，然后在终端中通过node - -debug-brk=5858 test.js命令连接要排错的脚本test.js

2016-03-08 22:11:29 572

原创关于API版本命名规范---语义化版本识别

语义化版本2.0.0一旦你定义了公共 API，你就可以透过修改相应的版本号来向大家说明你的修改。考虑使用这样的版本号格式：XYZ （主版本号.次版本号.修订号）修复问题但不影响API 时，递增修订号；API 保持向下兼容的新增及修改时，递增次版本号；进行不向下兼容的修改时，递增主版本号。这套系统为“语义化的版本控制”，在这套约定下，版本号及其更新方式包含了相邻版本间的底层代码和修改内容的信息。版

2016-03-07 20:25:05 1229

原创 HTML5通信API

跨文档消息传输的基本知识 HTML5提供了在网页文档之间互相接受与发送信息的功能，只要获取到网页所在窗口对象的实例，不仅同源（域+端口号）的Web网页之间可以互相通信，甚至可以实现跨域通信。首先，要想接受从其他窗口那里发过来的消息，就必须对窗口对象的message事件进行监视，代码如下所示：window.addEventListener("message",function(){...},f

2016-03-07 14:48:30 807

原创 Node建立HTTP服务器

Node.js将“HTTP服务器”这一层抽离，直接面向浏览器用户。建立一个HTTP服务器建立一个js文件，命名为node.js. 内容为：const http=require('http');http.createServer((request,response)=>{response.writeHead(200,{'Content-Type':'text/plain'});response.

2016-03-06 22:11:50 683

原创 Windows下配置Node.js

Windows上安装node.js windows安装包（.msi)下载地址：https://nodejs.org/en/双击下载的msi文件，跟安装其他应用程序一样安装即可。检测PATH环境变量是否配置了Node.js，点击开始=》运行=》输入”cmd” => 输入命令”path”，可以看到环境变量已经自动帮我们配置好了。 node –version命令查看node版本。

2016-03-06 19:09:53 371

原创 Node.js简介

Node.js是一个让JavaScript运行在服务端的开发平台，在服务端堪与PHP,Python,Perl,Ruby平起平坐。Node.js跳过了Apache,Nginx等HTTP服务器向用户提供服务，直接面向前端开发。Node.js的JavaScript引擎是V8，来自Google Chrome项目。1.Node.js内建了一个HTTP服务器支持，也就是说你可以轻而易举的实现一个网站和服务器的组

2016-03-06 19:07:47 383

原创 canvas 绘图API（二）

7.给图形绘制阴影在HTML5中，使用Canvas元素可以给图形添加阴影效果。添加阴影效果时，只需利用图形上下文对象的几个关于阴影绘制的属性就可以了，如下所示。shadowOffsetX–阴影的横向位移量。 shadowOffsetY–阴影的纵向位移量。 shadowColor–阴影的颜色。 shadowBlur–阴影的模糊范围。 shadowBlur属性是可选的，它表示图形阴影边缘的模糊

2016-03-05 14:34:40 532

原创 canvas绘制图形API(一）

canvas元素的基础知识 canvas元素是HTML5中的一个新增的重要元素，专门用来绘制图形。在页面上放置一个canvas元素，就相当于在页面上放置了一块“画布”，可以在其中进行图形的描绘。但是，在canvas元素中进行绘画，并不是拿鼠标来作画。事实上，canvas元素只是一块无色透明的区域，需要利用JavaScript编写在其中进行绘画的脚本。1. 用canvas元素基本知识1）取得canv

2016-03-04 11:12:00 1156

转载分享一个Markdown pad2 pro的授权key

邮箱地址： Soar360@live.com 授权秘钥： GBPduHjWfJU1mZqcPM3BikjYKF6xKhlKIys3i1MU2eJHqWGImDHzWdD6xhMNLGVpbP2M5SN6bnxn2kSE8qHqNY5QaaRxmO3YSMHxlv2EYpjdwLcPwfeTG7kUdnhKE0vVy4RidP6Y2wZ0q74f47fzsZo45JE2hfQBFi2O9Jldj

2016-03-01 20:47:33 8426

原创 Windows无法保存文件？

用MarkdownPad写笔记时，ctrl+s时窗口闪退无法选择保存路径，浏览器下载东西也是如此，无法保存，真是急煞我也！几天后才发现，原来是视频播放器搞的鬼，我看的教学视频是加密的，有个专门的播放器，关闭播放窗口之后一切正常，其中的原因便不知了。

2016-03-01 17:41:41 1276

原创 ajax用法示例

1.点击按钮弹出所请求的文件内容<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>无标题文档</title><script>//$(function(){}

2016-02-28 20:29:39 410

原创 Ajax中的get与post方式区别

1.get是把参数数据队列加到提交表单的ACTION属性所指的URL中，值和表单内各个字段一一对应，在URL中可以看到。post是通过HTTP post机制，将表单内各个字段与其内容放置在HTML HEADER内一起传送到ACTION属性所指的URL地址。用户看不到这个过程。 2.对于get方式，服务器端用Request.QueryString获取变量的值，对于post方式，服务器端用Request

2016-02-28 20:21:26 389

原创 Ajax的基本用法

一、Ajax的技术的产生 Ajax被认为是（Asynchronous JavaScript and XML的缩写）。现在，允许浏览器与服务器通信而无须刷新页面的技术都被叫做Ajax.一个HTTP请求一般由四部分组成 1、HTTP请求的方法或动作，比如是GET还是POST请求 2、正在请求的URL 3、请求头，包含一些客户端环境信息、身份要验证信息等 4、请求体，也就是请求正文，请求正

2016-02-28 20:17:03 562

原创 js闭包

闭包（closure）是Javascript语言的一个难点，也是它的特色，很多高级应用都要依靠闭包实现。闭包的特性闭包有三个特性：1.函数嵌套函数2.函数内部可以引用外部的参数和变量3.参数和变量不会被垃圾回收机制回收闭包的定义及其优缺点闭包是指有权访问另一个函数作用域中的变量的函数，创建闭包的最常见的方式就是在一个函数内创建另一个函数，通过另一个函数访问

2016-02-17 11:55:45 380

原创 HTML5语义化元素

在HTML 5对HTML 4所做的各种修改中，一个比较重大的修改就是为了使文档结构更加清晰明确，容易阅读，增加了许多新的结构元素。页眉主要用于页面的头部的信息介绍，也可用于板块头部<hgroup></hgroup> 页面上的一个标题组合一个标题和一个子标题，或者标语的组合<hgroup>语义化标签<h1>HTML5语义化标签</h1> <h2></h2></hgrou

2016-02-15 17:34:42 738

原创响应式布局解决方案之Media Query

布局实现　　采用何种方式实现布局设计，也有不同的方式，这里基于页面的实现单位而言，分为四种类型：固定布局、可切换的固定布局、弹性布局、混合布局。　　　　固定布局：以像素作为页面的基本单位，不管设备屏幕及浏览器宽度，只设计一套尺寸; 　　　　混合布局：同弹性布局类似，可以适应一定范围内所有尺寸的设备屏幕及浏览器宽度，并能完美利用有效空间展现最佳效果;只是混合像素、和百分比两种单位作为

2016-02-15 17:03:55 1353

原创浏览器页面渲染基本过程

像素完美（Pixel Perfection）、分辨率无关（Resolution Independent）和多平台体验一致性是设计师们的追求。可访问性（Accessability）、加载性能和重构灵活性则是前端工程师们关心的主题。其中加载性能与浏览器的渲染机制深深挂钩，弄明白浏览器背后的渲染机制，才能在日常的前端的开发中明白如何进行性能优化。浏览器如何渲染页面浏览器解析1、浏览

2016-02-15 15:57:22 499

原创 CSS选择器性能

CSS选择器损耗到底来自哪里呢？CSS选择器对性能的影响源于浏览器匹配选择器和文档元素时所消耗的时间，所以优化选择器的原则是应尽量避免使用消耗更多匹配时间的选择器。而在这之前我们需要了解CSS选择器匹配的机制，如子选择器规则：#header > a{font-weight:blod;}CSS选择器是从右到左进行规则匹配，例子中看似高效的选择器在实际中的匹配开销是很高的，浏览器必须遍历页面中所有的

2015-12-04 21:41:49 690

原创 js中console命令的使用

一、显示信息的命令<script type="text/javascript">console.log('hello');console.info('信息');console.error('错误');console.warn('警告');</script>控制台中显示结果二：占位符 console上述的集中度支持printf的占位符格式，支持的占位符有：字符（%s）、整数（%d或%i）、

2015-11-29 21:49:18 671

翻译 ECMAScript定义类或对象

使用预定义对象只是面向对象语言的能力的一部分，它真正强大之处在于能够创建自己专用的类和对象。 ECMAScript 拥有很多创建对象或类的方法。工厂方式原始的方式var oCar = new Object;oCar.color = "blue";oCar.doors = 4;oCar.mpg = 25;oCar.showColor = function() { alert(this

2015-11-28 22:19:39 461

原创 CSS样式优先权

当同一个 HTML 元素被不止一个样式定义时，会使用哪个样式呢？一般而言，所有的样式会根据下面的规则层叠于一个新的虚拟样式表中，其中数字 1拥有最高的优先权。 1.内联样式（在 HTML 元素内部） 2.内部样式表（位于标签内部） 3.外部样式表 4.浏览器缺省设置因此，内联样式（在 HTML 元素内部）拥有最高的优先权，这意味着它将优先于以下的样式声明：标签中的样式声明，外部样

2015-11-28 21:59:25 597

原创 CSS定位的兼容性问题

CSS定位的兼容性问题position:relative; 在 IE6 下父级的 overflow:hidden; 包不住子级的relative;position:absolute; 在 IE6 下定位元素的父级宽高都为奇数那么在 IE6 下定位元素的 right 和 bottom 都有1像素的偏差。position:absolute;绝对定位元素子级的浮动可以不用写清浮动方法； posit

2015-11-16 22:08:27 684

原创 Js自定义属性

HTML标签的自定义属性1、(隐式的方法) document.getElementById("testId").ggg = "new";2、(显式的方法)document.getElementById("testId").setAttribute("ggg", "new");在前台会展示该属性，用jquery也可以获取到值可以利用索引值建立与数组元素的匹配关系,从而实

2015-09-30 18:37:09 690

原创 CSS清除浮动

1、浮动产生的原因是什么呢浮动是什么情况呢？一般是一个盒子里使用了CSS float浮动属性，导致父级对象盒子不能被撑开，这样子CSS 浮动就产生了。2、浮动产生负作用由于浮动产生，如果对父级设置了样式（如： background、border等），而父级不能被撑开，所以导致样式不能显示。还有margin padding设置值不能正确显示，由于浮动导致父级子级之间设置了cs

2015-09-12 22:04:39 372

PXYStyle的博客