Reven_凯-优快云博客

翻译翻译 | 玩转 React 表单 —— 受控组件详解

原文地址：React.js Forms: Controlled Components原文作者：Loren Stewart译者：小 B0Y校对者：珂珂君本文涵盖以下受控组件： - 文本输入框 - 数字输入框 - 单选框 - 复选框 - 文本域 - 下拉选择框同时也包含: - 表单数据的清除和重置 - 表单数据的提交 - 表单校验点击这里直接查看示例代码。查看示

2017-07-30 12:19:14 2464

React技术栈耕耘 —— ReduxRedux 是近年来提出的 Flux 思想的一种实践方案，在它之前也有 reflux 、 fluxxor 等高质量的作品，但短短几个月就在 GitHub 上获近万 star 的成绩让这个后起之秀逐渐成为 Flux 的主流实践方案。正如 Redux 官方所称，React 禁止在视图层直接操作 DOM 和异步行为（ removing both asynchrony

2017-07-11 17:16:10 525

原创【前端学习笔记】JS学习基础

入门——————————————————————————————————————- 希望把某个元素移除你的视线：1、display:none; 显示为无 2、visibility:hidden; 隐藏 3、width \ height 4、透明度 5、left \ top 6、拿一个白色DIV盖住它 7、margin负值JS中如何获取元素： 1、通过ID名称来

2015-08-29 16:51:05 1586 2

原创 websocket上手，应用websocket广播同步客户端信息

本文内容基于nodejs，简单搭建node服务可参考 http://blog.youkuaiyun.com/u014420383/article/details/47945819websocket实现了浏览器与服务器全双工通信，允许多个客户端同时和服务器进行通信，也允许客户端主向多个客户端发送信息1.安装socket模块如果我们要使用websocket，需要先给服务器安装socket模块，例如给nod

2015-08-24 10:08:49 7286 1

原创简单搭建nodeJS服务，访问本地站点文件

搭建nodejs服务器步骤:1.安装nodejs服务(从官网下载安装)，node相当于apache服务器2.在自己定义的目录下新建服务器文件如 server.js 例如，我在E:\PhpProject\html5\websocket下创建了server.js文件var http = require('http');//引入http模块//开启服务，监听8888端口//端口号最好为6000以上v

2015-08-24 08:54:13 39698

原创新安装的wampserver怎么使用本机已有的mysql作为数据库

一般在一台没有安装mysql的机器上安装好wamp后，可以直接在wamp的phpMyAdmin中打开集成的mysql并设置用户信息。而如果之前已经安装配置好mysql（有用户名密码），之后才安装wamp的话，wamp的mysql会与本机mysql产生冲突，导致顶开phpMyAdmin的时候会报错，错误信息大致是“用户root未使用密码进行登录”。分析一下原因可以知道，phpMyAdmin会读电脑

2015-08-21 17:44:23 9782 1

原创 Wampserver 2.5 多站点配置方法

写在开头：本文适用于wampserver2.5版本，和wamp的老版本配置有语法上的区别，笔者正是因为被老版本的配置办法给整迷糊了所以才总结了一篇针对2.5版本的配置方法，如果您还停留在1.x或着已经到了3.x以上，请节省您宝贵的时间wamp是一个集成了apache、php、mysql的运行环境几个月前笔者开始使用wamp2.5学习php，由于那时候刚刚入门而且重心在于学习php，所以在配置wamp

2015-08-21 17:17:38 9211 2

原创【原生JS组件】javascript 运动框架

大家都知道JQuerry有animate方法来给DOM元素进行运动，CSS3中也有transition、transform来进行运动。而使用原生的Javascript来控制元素运动，需要写很多运动的细节以及兼容。然而，当你的BOSS不让你使用庞大的JQ框架，而且你开发的产品也需要在一些不兼容CSS3的浏览器运行的时候，你是否觉得每次都要开个定时器来琢磨运动该怎么进行，是件很费力的事情呢？那么福利来了

2015-08-20 14:57:23 2554

原创深入javascript面向对象，js的原型链、继承

进阶面向对象——————————————————————–在JS源码中，系统对象也是基于原型的程序，尽量不要去添加和修改系统对象的方法包装对象——————————————————————–基本类型都有自己对应的包装对象比如String Number Boolean基本类型会找到对应的包装对象类型，然后包装对象把所有的属性方法给了基本类型，然后包装对象消失例如 var str

2015-08-15 08:57:12 1697

原创初识Javascript的面向对象

面向对象编程概念—————————————————————–用对象的思想去写代码，就是面向对象编程过程式写法面向对象写法我们一直都在使用对象数组 Array 时间 Date面向对象编程(OOP的特点)—————————————————————-抽象：抓住核心问题封装：只能通过对象来访问方法继承：从已有对象上继承出新的对象多态：多对象的不同形态对象的组成———————————————

2015-08-15 08:50:00 1199

转载 js的隐含参数(arguments,callee,caller)使用方法

本篇文章只要是对js的隐含参数(arguments,callee,caller)使用方法进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助在提到上述的概念之前，首先想说说javascript中函数的隐含参数： arguments arguments 该对象代表正在执行的函数和调用它的函数的参数。[function.]arguments[n]参数: function：选项。当前正

2015-08-15 08:32:35 744

原创 Javascript 方法apply和call的区别

相同点: call()方法和apply()方法的作用相同：改变原调用函数的内部this指向。call()方法和apply()方法的第一个参数都是调用call/apply方法的函数内部this的指向。不同点: 当调用call/apply方法的函数有参数时，call/apply方法也需要传参call的2参、3参...n参分别表示原函数的1参、2参...n-1参apply的2参是一个数组，数组元素

2015-08-10 11:53:18 967

原创 style.height、offsetHeight、clientHeight、scrollHeight的区别

style.height 包括元素的滚动条,不包括边框clientHeight 不包括元素的滚动条和边框offsetHeight 包括元素的滚动条和边框scrollHeight offsetHeight+scrollTop小贴士: 在IE下，创建一个oLi <style> li{/*不设置li的高度*/} </style

2015-08-09 21:33:29 1383

原创【前端学习笔记】JQuery事件细节、JQ进阶常用方法

事件细节———————————————————————ev直接使用，不需要兼容操作ev.pageX(Y) 鼠标的坐标(相对于文档) : ev.clientX(相对于窗口)ev.which(能监控鼠标键值) : ev.keyCodeev.preventDefault(); //阻止默认事件ev.stopPropagation(); //阻止冒泡事件函数结尾return false;既能阻止冒泡又能阻止

2015-08-09 17:04:29 1757

原创【前端学习笔记】JQuery的基本思想、常用方法

JQ思想————————————————————————1.模仿CSS获取元素2.方法函数化，JQ以各种方法传参代替了JS的属性赋值操作3.方法链式操作4.和原生共存，写法不能混用5.取值赋值合用一个方法，区别于加不加参数，当一组元素取值时，取的是第一个元素的值，取出所有元素需要循环。而赋值时，直接赋值给这组的每个元素$()下的常用方法————————————————————–has()

2015-08-09 16:49:51 906

原创 HTML/CSS 清浮动的方法

方法1: 加class.clear{zoom:1;}.clear:after{content:"";display:block;clear:both;}方法2: 给父级加 position:absolute/fixed方法3: 给父级加overflow:hidden (注意:ie6 下父级的overflow:hidden;是包不住子级的相对定位的)

2015-08-08 17:24:22 791

原创 HTML/CSS 块、内嵌、浮动、定位元素的特点对比

内联，内嵌，行内属性标签——————————————– 1、默认同行可以继续跟同类型标签； 2、内容撑开宽度 3、不支持宽高 4、不支持上下的margin和padding 5、代码换行被解析成空格块属性标签————————————————————- 1、默认独占一行显示； 2、没有宽度时，默认撑满一排 3、支持所有css命令inline

2015-08-08 17:22:27 1910

原创 HTML/CSS 选择符优先级

CSS的选择符优先级1、同级样式默认后者覆盖前者2、样式优先级类型(1) < class[type](10)=伪类(10) < id(100) < style行间样式(1000) < style内部样式 < link外部引入样式选择符的对应值综合相加起来大的优先级高注 : 对应值只是代表他们的等级， 11个类型选择符的优先级仍然小于1个类选择符，以此类推3、important

2015-08-08 17:16:35 1554

原创 HTML/CSS IE6、7兼容性问题、bug总汇

IE6，7下li、img的间隙———————————————————在IE6，7下li本身没浮动,但是li内容有浮动的时候，li下边就会产生几px的间隙解决办法: 1.给li加浮动,给其父级清浮动 2.给li加vertical-align:top;当IE6下最小高度问题，和 li的间隙问题共存的时候给li加浮动img元素在本身没有浮动也没有宽高的时候，会距离父级底部有几px间隙

2015-08-08 17:01:51 1540 1

原创 HTML CSS的兼容性问题、IE6BUG之浮动与定位篇

IE6下内容撑开设置宽高———————————————————-在IE6下，内容会撑开设置好的宽高例如，给固定宽度的wrap_div下放left_div、right_div两个div并浮动，wrap_div的宽度正好放下两个内部div(两个内部div也设置了宽度)。在IE6下，如果left_div或right_div内部内容宽度大于div本身宽度，内容就会撑开宽度让wrap_div容不下

2015-08-08 16:45:48 2182 1

原创 HTML CSS的兼容性问题、IE6BUG之外边距篇

上下外边距叠压问题—————————————————- 例如一上一下两个div，上div设置margin-bottom:10px，下div设置margin-top:10px，结果只会让两个margin叠压在一起，而不会相加为20px 解决办法:把其中一个margin换成paddingmargin传递问题———————————————————- IE6,7下父子级包含的

2015-08-08 16:37:07 1243 1

原创【前端学习笔记】原生Javascript中通过JSONP(前端常用方法)进行跨域

Ajax跨域—————————————————————————-跨域: 跨域名一个域名下的文件去请求了和他不一样的域名下的资源文件，那么就会产生跨域请求这是ajax的跨域限制问题跨域的解决 : jsonp: json width padding核心: 1.script标签 2.用script标签加载资源是没有跨域问题的 3.script只认文件的实际内容，而不是后缀。只要

2015-08-07 08:08:05 1240 1

原创【前端学习笔记】原生Javascript中的ajax

ajax概念———————————————————————————-ajax:Asynchronous Javascript and XML异步的js和XML，用javascript异步形式去操作xml用于数据交互表单(原理相似)——————————————————————————–数据的提交 action : 数据提交的地址默认是当前页面 method : 数据提交的方式默认是

2015-08-07 08:01:30 685 1

原创【前端学习笔记】Javascript中的正则表达式-实例

正则表达式版的getByClass()——————————————-function getByClass(oParent,sClass){ var arr=[]; var aEle =oParent.getElementsByTagName('*'); var rg=new RegExp('\\b'+sClass+'\\b'); //

2015-08-05 23:51:44 567 1

原创【前端学习笔记】Javascript中的正则表达式

复习字符串操作—————————————————————————–indexOf 查找字符返回位置charAt 查找位置返回字符substring 获取字符窜split 分割字符串正则表达式的概念和写法—————————————————正则：也叫做规则，让计算机能够读懂人类的规则正则都是操作字符串的。正则的写法：var re = /a/; 和数组字符串区分开来v

2015-08-05 23:45:05 1085 1

原创【前端学习笔记】重要知识点积累

递归调用———————————————————————————1.函数调用函数自身，开始执行递的动作。2.最后一次给他一个判断终止的条件，开始回头执行归的动作3.简单的递归实例//求阶乘 function jieCheng(i){ if(i<=1) //2.最后一次给他一个判断终止的条件，开始回头执行归的动作 return 1;

2015-08-05 07:43:23 1163 1

原创【前端学习笔记】项目经验积累（不定期更新）

样式重置—————————————————————————–/* reset */ body,h1,h2,h3,h4,h5,p,dl,dd,ul,ol,form,input,textarea,th,td,select { margin:0; padding:0; } em { font-style:normal; } li { list-style:none; } a

2015-08-04 17:28:04 1148 1

原创【前端学习笔记】深入学习Javascript:Cookie

Cookie—————————————————————————————-cookie : 存储数据，当用户访问了某个网站（网页）的时候，我们就可以通过cookie来像访问者电脑上存储数据 1.不同的浏览器存放的cookie位置不一样，也是不能通用的 2.cookie的存储是以域名形式进行区分的 3.cookie的数据可以设置名字的 4.一个域名下存放的cookie的个

2015-08-04 17:05:30 507 1

原创【前端学习笔记】深入学习Javascript:EVENT应用

元素拖拽原理————————————————————————————–onmousedown : 选择元素onmousemove : 移动元素onmouseup : 释放元素拖拽事件结构oDiv.onmousedown = function(ev) { var ev = ev || event; var disX = ev.clientX -

2015-08-04 16:54:49 501 1

原创【前端学习笔记】深入学习Javascript:EVENT总结

焦点事件———————————————————————————————–焦点 : 使浏览器能够区分用户输入的对象，当一个元素有焦点的时候，那么他就可以接收用户的输入。我们可以通过一些方式给元素设置焦点1.点击2.tab3.js不是所有元素都能够接收焦点的.能够响应用户操作的元素才有焦点onfocus : 当元素获取到焦点的时候触发onblur : 当元素失去焦点的时候触发obj.focus(

2015-08-04 16:49:20 754 1

原创【前端学习笔记】深入学习Javascript:DOM和BOM的方法及属性总结

DOM相关方法——————————————————————————————– 利用getElementsByTagName来创建通过类名获取元素的方法getElementsByClssName—————————– 1.利用getElementsByTagName获取所有元素 2.利用split函数将得到的元素的className通过空格截断为数组，然后一一判断是否和所找的className元素

2015-08-04 16:16:53 689 1

原创【前端学习笔记】深入学习Javascript:DOM机制

DOM概念———————————————————————————– DOM : Document Object Model 文档对象模型文档：html页面文档对象：页面中元素文档对象模型：定义为了能够让程序(js)去操作页面中的元素DOM会把文档看作是一棵树，同时定义了很多方法来操作这棵数中的每一个元素（节点） DOM节点getElementById getElementByTa

2015-08-04 16:09:18 581 1

原创【前端学习笔记】JS基础

入门-------------------------------------------------------------------------------------------------------------------希望把某个元素移除你的视线： 1、display:none; 显示为无 2、visibility:hidden; 隐藏 3、width

2015-08-04 12:11:52 850 1