zoukankan      html  css  js  c++  java
  • JS-改变页面的颜色(三)

    需求:点击页面的按钮,改变页面的颜色

    思路:一先画出最简单的页面,二想办法获取页面的body节点,三想办法修改body节点的背景颜色属性,四通过一个方法获取随机的颜色值

              和第二个例子(JS-改变页面的颜色(二))相比仅仅是改变了生成颜色值的思路

    简单的代码片段如下所示:

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8"/>
        <title>Change Page Color Script</title>
        <script>
            /*
              改变页面的背景颜色
            */
            function changePageColor()
            {
                //拿到body元素
                var bodyArray=document.getElementsByTagName("body");
                var body=bodyArray[0];
                //修改body元素的背景颜色属性
                body.setAttribute("bgcolor",getColorValue());
            }
            /*
              获取背景颜色的十六进制表示值,这个方法也是前段简单的验证码的编写思路
            */
            function getColorValue()
            {
                //这里不再是随机的颜色了,可以根据自己的喜好选择几种颜色,作为备选的页面改变颜色
                var charArray = new Array('AliceBlue', 'Chartreuse', 'DarkGreen', 'GreenYellow', 'LimeGreen', 'PaleGreen', 'SpringGreen', 'Red', 'Orange ', 'MediumSpringGreen ','Indigo', 'DarkMagenta', 'Blue', 'DarkGray', 'Fuchsia', 'Lime');
                var charIndex = Math.floor(Math.random() * 16);
                return charArray[charIndex];
            }       
        </script>
    </head>
    <body bgcolor="green" align="center">
        <input type="button" value="ChangePageColor" onclick="changePageColor();"/>
    </body>
    </html>
  • 相关阅读:
    web安全-接入层注入
    web安全-密码安全
    web安全-传输安全
    Jenkins-安装
    RobotFramework-关键字
    RobotFramework-调用.py文件
    RobotFramework-登录
    SQL-行转列(PIVOT)实例1
    SQL-AdventureWorks样例数据库
    TestDescription文档描述测试过程
  • 原文地址:https://www.cnblogs.com/godtrue/p/5801115.html
Copyright © 2011-2022 走看看