Question

我正在尝试建立一个网站，但我遇到了问题。当我在Chrome中运行它时，我得到：“无法设置未定义的属性'backgroundColor'”。我不明白为什么我得到这个。我的var不是数组（只是一个id）。我一直在谷歌搜索它2个小时，但没有任何帮助我。

这是我的HTML代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
    <title>Folio</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <link rel="stylesheet" type="text/css" href="style.css"/>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="anim2.js"></script>      
</head>
<body>
    <div id="tout">
        <img id="menu_jaune" src="menu_jaune.png" alt="le menu"/></td>
        <div id="bandeau_graphisme">
            <img id="dev" src="dev3.png" alt="image de couverture du site"/>
        </div>
        <div id="surmenu">
            <div id="menu">
                <img id="ar" src="ar.png" alt="ar"/>
            </div>
        </div>
        <div id="go">
            <p id="wtf">HERE WE GO!</p>
        </div>
        <div id="reste">
        </div>
    </div>
</body>

我的Javascript代码：

$(document).ready
(
function()
{
    $("#go").bind("click", remonte)
}
);

function remonte(){ 
$("#menu").animate({marginTop: "-460"}, 500);
$("#ar").animate({marginTop: "120"}, 500);
$("#reste").animate({height: "500", marginTop: "-50"},400);
$("#go").remove();  
setTimeout(charge, 510);    
}

function charge(){
    $('#reste').load("about.html",'',montreNouveauContenu);
    $("#surmenu").style.backgroundColor="transparent"; //HERE
    $("#menu_jaune").animate({width: "900"}, 500);
}

function montreNouveauContenu() {  
$('#content').show('normal');  
}  
function suppr(){
$("#dev").remove();
$("#reste").remove();
$("#content").remove();
$("#bandeau_graphisme").animate({height: "255"},500);
}

提前谢谢。

Answer 1

这是因为jQuery对象没有style属性。

    // ---------v----???
$("#surmenu").style.backgroundColor="transparent"; //HERE

应该是这样的：

$("#surmenu").css("backgroundColor", "transparent");

如果您想使用DOM API，可以进行传统的DOM选择：

document.getElementById("surmenu").style.backgroundColor="transparent";

Answer 2

这是一个jQuery对象，而不是一个元素，因此它没有style属性。你想要这个：

$("#surmenu")[0].style.backgroundColor="transparent"; //HERE

或者这......

$("#surmenu").get(0).style.backgroundColor="transparent"; //HERE

或者这......

$("#surmenu").css( 'background-color', 'transparent' ); //HERE

Javascript - 无法设置属性'backgroundColor'

2 个答案: