Javascript 动态更改背景颜色失败_Javascript_Html_Css

Javascript 动态更改背景颜色失败

javascript html css

Javascript 动态更改背景颜色失败,javascript,html,css,Javascript,Html,Css,编辑：这可能不完全是因为你们所说的颜色值的长度。因为即使我添加了这一行，它仍然不会像应该的那样改变Safari上的背景： newEle.style.background = "-webkit-gradient(linear, left top, right top, from(#2F2727), to(#FF0000))"; 我正在动态设置HTML p元素的背景色。我的问题：当我在ele.style.backgroundColor中存储字符串（从函数返回）时，它不会保留或更改背景颜色。我不确

编辑：这可能不完全是因为你们所说的颜色值的长度。因为即使我添加了这一行，它仍然不会像应该的那样改变Safari上的背景：

newEle.style.background = "-webkit-gradient(linear, left top, right top, from(#2F2727), to(#FF0000))";

我正在动态设置HTML p元素的背景色。

我的问题：当我在ele.style.backgroundColor中存储字符串（从函数返回）时，它不会保留或更改背景颜色。我不确定为什么我的函数不能将此元素的背景色更改为黑色

<html>
<head>
</head>
<body>

    <div id="mainContent">
        <p id="test">abcdef</p>
    </div>

</body>
    <script type="text/javascript">
    <!--

        function decimalToHex( num )
        {
           // num is usually a decimal color in form ARGB

           if (num == null || num == "undefined") { return "#FFFFFF"; }

           var intNum = (parseInt(num,10)) & 0x00FFFFFF;
           return "#"+intNum.toString(16);
        }

        var newEle = document.createElement("p"); 
        newEle.style.backgroundColor = decimalToHex(0); // this fails doesn't set the background color
        //newEle.style.backgroundColor = "#FF0000";       // But this works & sets it to red. Whats wrong with my function?!
        newEle.innerHTML = "kjdskjdkgj";
        document.getElementById("mainContent").appendChild(newEle);
    -->
    </script>
</html>

abcdef

您需要用零填充结果，因为您的函数将只返回参数为0的#0

做一些类似的事情

var s = intNum.toString(16);
while(s.length < 6) s = "0" + s;
return "#" + s;

var s=intNum.toString（16）；
而（s.length<6）s=“0”+s；
返回“#”+s；

编辑：您的函数是正确的，但需要传入正确的参数。它需要是一个3或4字节的整数，其中最后3个字节分别是r、g和b值，即不是0，而是类似于0x00DEFEED（十进制为14614253）

您甚至在注释中说数字的格式为ARGB，假设每个数字都是1字节，则这是正确的。

颜色有三个组成部分，您的函数只返回一个。如有必要，让函数仅返回前导零填充的数字：

       var intNum = '' + (parseInt(num,10)) & 0x00FFFFFF; 
       intNum = intNum.toString(16);
       if (intNum.length < 2) intNum = '0' + intNum;
       return  intNum;

编辑请注意，ah HTML页面中的颜色是以各种方式指定的，但它始终有3个组件：红色、绿色和蓝色。它总是一根弦

十六进制：#rgb或#rrggbb

在本例中，前导#表示十六进制值。如果下面只有3个字符，则每个字符代表一个红色、绿色和蓝色值。如果有6个字符，则每对代表一个值

十进制：rgb（r、g、b）

在这种情况下，值以逗号分隔，每个值可以是一个、两个或三个字符

百分比：rgb（10%、15%、20%）

在本例中，值以逗号分隔，表示每种颜色的百分比

这一切都在

尝试将脚本代码粘贴到body或head标记中。您正在尝试从body标记中粘贴脚本代码，这可能会产生问题。您的函数正在输出十进制0的“#0”，这不是有效的css颜色#000或#000000是用十六进制符号表示黑色的合法方式。我不确定我是否理解您如何用整数表示RGB。你能解释一下吗？阅读有关如何指定颜色的说明。长度必须为2，因为颜色是3个数字，每个数字由2个数字组成，每个数字连接在一个字符串中，所以它不是一个数字。他不想要一个格式为#RRGGBB的字符串吗？我意识到我的方法有问题，但是整数部分的长度是3*2=6实际上他的函数是对的，他只是用错了。如果他输入了一个4字节的整数，其中最后3个字节实际上都是1字节的整数，那就行了。这是正确的，但它是3个独立的数字，你不能只在左边填充，或者你可以将数字向右移动，例如#ff变为#0000ff，从红色变为绿色。这就是他的输入错误的原因。它应该只被传递一个至少有3个字节（RGB每个字节1个）的参数。在这种情况下，除了R字节之外，不需要填充内容。问题是我有一个长的十进制，格式为ARGB。是否可以将其分解为A、R、G、B值？RGB是从0到255（十进制）或0到FF（十六进制）的三个值。我不知道A是什么。必须分别转换每个值。我会将字符串拆分为多个组件，对每个组件进行转换，然后将其重新组合在一起。提供一些值的示例以及您希望如何处理这些值。

newEle.style.backgroundColor = '#' + decimalToHex(255) + 
                                     decimalToHex(0) + decimalToHex(0);