1. 程式人生 > >backgroundColor和background-color的區別

backgroundColor和background-color的區別

(1)background-color在CSS裡用。

(2)backgroundColor在js處理CSS裡用,是DOM.style.backgroundColor,要注意大小寫(字母C)。
經測試,在JS中指定該樣式時,這兩個都能起作用,但請在JS中儘量使用backgroundColor.



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <style type="text/css">
        form
        {
            border: 2px green solid;
            padding: 2px;
            margin: 0;
            background: #efe;
        }
        div
        {
            color: red;
        }
        fieldset
        {
            margin: 1px;
            padding: 3px;
        }
    </style>
    <script src="../Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
    <script src="../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
</head>
<body>
    <form action="HTMLPage1.htm">
    <div>
        Form is surrounded by the green border.
    </div>
    <label for="name">
        Child of form:
    </label>
    <input name="name" id="name" />
    <fieldset>
        <label for="newsletter">
            Grandchild of form, child of fieldset:</label>
        <input name="newsletter" id="newsletter" />
    </fieldset>
    </form>
    <label for="none">
        sibling to form:</label><input name="none" id="none" />
    <script type="text/javascript">
        $("form input").css("border", "2px dotted blue");
        $("form fieldset input").css("backgroundColor", "yellow");//JS標準
        $("form fieldset input").css("background-color", "yellow");//不推薦在JS中用
        $("form fieldset input").css("background-Color", "yellow");//好奇試了下,這種寫法中C大寫也能顯示(瀏覽器竟然支援,換做其它字母大寫就不行了)
    </script>
</body>
</html>

PS: 當然Jquery對上述寫法都是認可的: