转载

表单验证第三部分: 一个Validity State API Polyfill

在这个系列的上一篇文章中, 我们创建了一个轻量级的脚本 (6kb, 2.7kb缩小后) 使用这个 Validity State API 来提高原生的表单验证体验。 这个脚本可以在所有的现代浏览器上运行,并且支持 IE10版本以下的浏览器。但是,浏览器本身仍然具有一些缺陷。

表单验证第二部分: 约束验证 API

上一篇文章中, 我向大家展示了如何通过组合输入类型 (例如, <input type='email'>) 和验证属性 (像requiredpattern)来使用原生的浏览器表单验证机制。诚然,这种方式非常的简单而且轻量级。但是它仍然具有一些缺点 。

表单验证第一部分:使用 HTML 和 CSS技巧对表单进行约束验证

大多数的JavaScript表单验证类库体积都非常庞大,而且往往需要引入其他的库,像jQuery。 例如,MailChimp的嵌入式表单,包含了140kb的 验证文件(压缩后)。它引入了整个jQuery库,以及一个第三方的表单验证插件,还有一些原生的MaiChimp代码。实际上,正是MailChimp的嵌入式表单引发了我对于现代表单验证的一系列思考。我们现在有哪些新工具可以进行表单验证?哪些是可行的?哪些又是仍然需要的?

深入解析 ES6:模板字符串

在 ES6 中引入了一种新的字符串字面量 —— 模板字符串,除了使用反引号 (`) 表示,它们看上去和普通的字符串没有什么区别。在最简单的情况下,他们就是普通的字符串。之所以被称为模板字符串,是因为模板字符串为 JS 引入了简单的字符串插值特性,也就是说,可以方便优雅地将 JS 的值插入到字符串中。

CSS魔术师Houdini API介绍

今天想继续 CSS 的议题,常常会觉得学 CSS 的新技术不太划算,因为每次看到新的 Feature 出现,都只能当下兴奋几分钟,然后就会认命接受可能还要再等个五年才能真正使用的可能性…如果你有跟我一样的感受,那今天这篇文章或许可以带给你一丝丝希望。

JavaScript 继承总结

原型几乎贯穿了各种 JavaScript 继承方式。理解以及灵活利用原型是写出优秀代码的关键。无论是继承还是创建对象,最终理想的方案都是将几种不同方式的优点结合在一起,这正是 JavaScript 灵活的魅力。

详解JavaScript构造器

对构造函数有很好的理解是你掌握JavaScript这门语言的重点。我们都知道JavaScript不像其他语言,它没有class关键字,但是它有跟function非常相似的构造函数。这篇文章我们一起来详细地了解JavaScript构造函数如何构造对象。构造函数跟普通函数非常相似,但是我们通过new关键字来使用它们。主要有两种类型的构造函数,native构造函数(Array,Object)它们可以在执行环境中自动生成,还有自定义的构造函数,你可以定义自己的方法和属性。

React初学者教程15:设置React开发环境

概述:学习如何配置 Node、Babel 和 Webpack 来高效创建 React 应用。最后要学习的是如何设置创建 React 应用的开发环境。回顾一下我们在学习创建第一个 React 应用程序的时候,讨论这种方法时说过:这种方法的负面是性能。因为浏览器除了要加载页面以外,还得把 JSX 转换为实际的 JavaScript。这个转换过程很耗时,最好是在开发期间就转换了。如果应用程序的每个用户都要为这个性能买单,这就不好了。

React 初学者教程14:在React中访问DOM元素

有时我们需要直接访问 HTML 元素上的属性和方法。在 React 的缤纷世界里,JSX 代表纯粹的标记,那么为什么你会想要直接处理可怕的 HTML 呢?因为你会发现,很多时候直接通过 JavaScript DOM API 处理 HTML 元素,比用 React 的方式更简单。

React 初学者教程13:用 React 创建一个简单的 Todo List 应用

概述:通过学习如何创建经典的 Todo List 应用,将所有学过的 React 技巧投入到实战中。如果说创建 “Hello, World!” 示例是庆祝你开始涉足 React,那么创建一个经典的 Todo List 应用是庆祝你接近掌握 React!在本教程中,我们要把已经学习过的很多概念和技术综合在一起,创建一个如下的应用:

页面

返回顶部