< input type=”color” >是一个取色器，本文主要介绍如何利用< input type=”color” >实现页面背景颜色的改变（此代码可以用于页面变化皮肤）

1.原理：

首先给body设一个背景颜色，当取色器中颜色改变时，通过js中的style动态改变背景颜色。

2.代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body style=" background: rgb(238, 255, 255);">
    <input  type="color" id="onchange">
</body>
<script type="text/javascript">
    document.getElementById('onchange').onchange = function(){
        document.getElementById('onchange').click();
        document.body.style.background = this.value;
    };
</script>
</html>

3.效果：

(1).首先显示body最先设置的颜色

javascript背景特效代码 javascript背景颜色代码_背景颜色

(2).点击取色器后，弹出颜色选择

javascript背景特效代码 javascript背景颜色代码_javascript背景特效代码_02

(3).选中颜色，点击确定，背景颜色被替换

javascript背景特效代码 javascript背景颜色代码_html_03