html5中的input新属性range使用记录

在喧嚣的世界里生活了那么久，突然被抽离出电脑、电视和手机，仿佛回到了最原始的状态，宛如一次洗涤，让我重新审视自我。这种清净之中，也带来了一丝惶恐。仿佛脱离了现代文明，我失去了基本的生存能力，倘若时光倒流，我究竟能存活多久？

感慨之余，我还是得回归现实，继续我的工作。今天我要记录的是HTML5中的一个新属性——range，这个属性是在一个网站的调色器中发现的。它以一种非常直观、形象的方式呈现，让我眼前一亮。

这个调色器的代码很简单，如下：

复制代码如下：

在这里，我们看到了type的另外两个属性：min和max，它们分别代表了允许的最小范围和最大范围。除此之外，我们还可以对range进行样式设计。例如：

复制代码如下：

在这个基础上，我们可以写一个JavaScript方法，来改变数值，这正是调色器中所应用的原理。尽管我还不太明白如何改变移动钮的样式，但这并不妨碍我对它的理解。代码如下：

复制代码如下：

随着拖动位置的变化，输入框中的值也会相应改变。放置三个这样的元素就能生成颜色，这就是调色器的原理。除此之外，还需要注意range的其他两个属性：value默认值以及step改变幅度。这个调色器看起来很实用，回头我得尝试做一个看看。此刻，我先去睡觉了。

使用cambrian的render方法将内容渲染到网页的body部分：

cambrian.render('body')