当前位置: 移动技术网 > IT编程>开发语言>JavaScript > 结合H5和JS修改背景颜色

结合H5和JS修改背景颜色

2020年07月17日  | 移动技术网IT编程  | 我要评论
使用H5表单新增加的type元素进行选择颜色,接着定义一个方法,在onchange事件会在域的内容改变时发生的时候触发,操作谁就获取谁来操作。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <titl

使用H5表单新增加的type元素进行选择颜色,接着定义一个方法,在onchange事件会在域的内容改变时发生的时候触发,操作谁就获取谁来操作。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    颜色:<input type="color" id="col" onchange="changeColor()">
    <script>
    var color=document.getElementById("col");//操作谁就获取谁
    function changeColor(){
        document.body.style.backgroundColor=color.value;//将h5所选择的颜色值赋值给背景颜色
    }
</script>
    
</body>
</html>
    

运行结果:

在这里插入图片描述
实践是检验真理的唯一标准。

本文地址:https://blog.csdn.net/Dreamer_Ji/article/details/107359483

如您对本文有疑问或者有任何想说的,请 点击进行留言回复,万千网友为您解惑!

相关文章:

验证码:
移动技术网