input placeholder placeholder是HTML 5 <input> 的属性,，是表单元素input的一个占位符。兼容性 caniuseie 11+firefox 49+chrome 49+safari 9.1+Opera 41+iOS Safari 9.3+Opera Mini allAndroid Browser 4.4+Chrome for Android 53+通过下面几行代码就可以 设置
常用正则表达式 官方文档 参考1、校验字符是否全由数字组成function isDigit(s) { var patrn=/^[0-9]+$/; //其他写法 var patrn =new RegExp("^\\d+$"); return patrn.test(s); if (!patrn.exec(s)) return false return true; }2、校验登录名：只能输入5-2
炫酷站点 插件weui – A UI library by WeChat official design team, includes the most useful widgets/modules in mobile web applications.官方网站FrozenUI – FrozenUI的CSS组件库,基于腾讯手Q样式规范官方网站FullPage.js–Create full screen pag
移动端css技巧 一、移动端伪类 :active 生效移动端基本没有:active的概念，因为不像鼠标，会有经过状态，但是并不代表移动端的:active是没有的要CSS伪类 :active 生效，只需要给 document 绑定 touchstart 或 touchend 事件。具体代码：style> a { color: #000; } a:active { color: #fff;}
Asynchronous JavaScript and XML（Ajax） 原生JavaScript的写法：来源var xmlReq;if (window.XMLHttpRequest) {// code for all new browsers xmlReq=new XMLHttpRequest();}else if (window.ActiveXObject) {// code for IE5 and IE6 xmlReq=new ActiveXObject
React ajax 来源通过 AJAX 加载初始数据，引入jQuery。在 componentDidMount 时加载数据。当加载成功，将数据存储在 state 中，触发 render 来更新你的 UI。当执行同步请求的响应时，在更新 state 前， 一定要先通过 this.isMounted() 来检测组件的状态是否还是 mounted。<head> <meta charset="UTF-8"> <
React Tips 一、JSX 中的 If-Else 来源没法在JSX中使用 if-else 语句，因为 JSX 只是函数调用和对象创建的语法糖。可以采用三元操作表达式：React.render(Hello World!, mountNode);当三元操作表达式不够健壮，你也可以使用 if 语句来决定应该渲染那个组件。var loginBut
React form 来源表单组件支持几个受用户交互影响的属性： a. value，用于 <input>、<textarea> 组件。 b. checked，用于类型为 checkbox 或者 radio 的 <input> 组件。 c. selected，用于 <option> 组件。在 HTML 中，<textarea> 的值通过子节点设置；在 React 中则应该使用 value 代替。表单组件可
React 复合组件 来源一、动机：关注分离 通过复用那些接口定义良好的组件来开发新的模块化组件，我们得到了与使用函数和类相似的好处。具体来说就是能够通过开发简单的组件把程序的不同关注面分离。如果为程序开发一套自定义的组件库，那么就能以最适合业务场景的方式来展示你的用户界面。<script type="text/jsx"> //组合实例 var Avatar
React 生命周期 来源 1一、组件的生命周期分成三个状态： Mounting：已插入真实 DOM Updating：正在被重新渲染 Unmounting：已移出真实 DOM二、React 为每个状态都提供了两种处理函数，will 函数在进入状态之前调用，did 函数在进入状态之后调用，三种状态共计 五种处理函数: componentWillMount() componentDidMoun
React event 来源一、虚拟事件对象事件处理器将会传入 虚拟事件对象 的实例，一个对浏览器本地事件的跨浏览器封装。它有和浏览器本地事件相同的属性和方法，包括 stopPropagation() 和 preventDefault()，但是没有浏览器兼容问题。如果因为一些因素，需要底层的浏览器事件对象，只要使用 nativeEvent 属性就可以获取到它了。每一个虚拟事件对象都有下列的属性：boolean bubbl
React 标签和属性支持 来源React 尝试支持所用常用的元素。一、HTML 元素下列的 HTML 元素是被支持的：a abbr address area article aside audio b base bdi bdo big blockquote body br button canvas caption cite code col colgroup data datalist dd del details dfn
React refs 来源：七、获取真实的DOM节点组件并不是真实的 DOM 节点，而是存在于内存之中的一种数据结构，叫做虚拟 DOM （virtual DOM）。只有当它插入文档以后，才会变成真实的 DOM 。根据 React 的设计，所有的 DOM 变动，都先在虚拟 DOM 上发生，然后再将实际发生变动的部分，反映在真实 DOM上，这种算法叫做 DOM diff ，它可以极大提高网页的性能表现。但是，有时需要从组件获
React props 一、props用法来源组件的属性可以接受任意值，字符串、对象、函数等等都可以。有时，我们需要一种机制，验证别人使用组件时，提供的参数是否符合要求。1、PropTypes组件类的PropTypes属性，就是用来验证组件实例的属性是否符合要求。<script type="text/jsx"> var MyTitle = React.createClass({ getDefault
React state 来源1 来源2组件免不了要与用户互动，React 的一大创新，就是将组件看成是一个状态机，一开始有一个初始状态，然后用户互动，导致状态变化，从而触发重新渲染 UI//demo1<script type="text/jsx"> var HelloWorld = React.createClass({ getInitialState
React.Children 来源React.Children 为处理 this.props.children 这个封闭的数据结构提供了有用的工具。1、React.Children.mapobject React.Children.map(object children, function fn [, object context])在每一个直接子级（包含在 children 参数中的）上调用 fn 函数，此函数中的 this
5-策略模式 参考书籍: Javascript设计模式与开发实践（曾探）在程序设计中，要实现某一个功能有多种方案可以选择。比如一个压缩文件的程序，既可以选择zip 算法，也可以选择gzip 算法。这些算法灵活多样，而且可以随意互相替换。这种解决方案就是本章将要介绍的策略模式。策略模式的定义是：定义一系列的算法，把它们一个个封装起来，并且使它们可以相互替换。一、使用策略模式计算奖金很多公司的年终奖是根据员工的工资
4-单例模式 要实现一个标准的单例模式并不复杂，无非是用一个变量来标志当前是否已经为某个类创建过对象，如果是，则在下一次获取该类的实例时，直接返回之前创建的对象。一、标准单例模式//e.g.method1var Singleton = function(){ this.name = name; this.instance = null;};Singleton.prototype.getName
3.2-高阶函数 参考书籍: Javascript设计模式与开发实践（曾探）高阶函数是指至少满足下列条件之一的函数。 函数可以作为参数被传递； 函数可以作为返回值输出。一、函数作为参数传递把函数当作参数传递，这代表我们可以抽离出一部分容易变化的业务逻辑，把这部分业务逻辑放在函数参数中，这样一来可以分离业务代码中变化与不变的部分。其中一个重要应用场景就是常见的回调函数。1、回调函
3.1-闭包 一、变量的作用域 变量的作用域，就是指变量的有效范围。当在函数中声明一个变量的时候，如果该变量前面没有带上关键字var，这个变量就会成为全局变量，这当然是一种容易造成命名冲突的做法。另外一种情况是用var 关键字在函数中声明变量，这时候的变量即是局部变量，只有在该函数内部才能访问到这个变量，在函数外面是访问不到的。在JavaScript 中，函数可以用来创造函数作用域。此时的函数像一层半透明的
关注
