Question

考虑下面的HTML代码。在那段代码中，我动态地添加了一个带有类＆＃34;动态＆＃34;的DIV。我期待它会获取为该类定义的CSS属性，而这些属性反过来会显示黑色方块。然而，黑色方块从未出现过。我在这里做错了吗？如果没有，那么是否有一种方法可以预先定义CSS属性并动态添加元素，或者我应该在添加元素之后将css属性添加到元素中（这看起来很不方便）。感谢。

<!DOCTYPE html>

<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script>

$(function() {

    $("body").append(
        $("<div/>").attr("class", "dynamic")
    )

});

</script>

<html>
<head>
<style>

.dynamic {
    backgorund-color: black;
    width: 100px;
    height: 130px;
    left: 10px;
    top: 10px;    
}

</style>
</head>

<body>
</body>

</html>

Answer 1

在你的课堂上，拼写背景不正确：

.dynamic {
    background-color: black;
    width: 100px;
    height: 130px;
    left: 10px;
    top: 10px;    
}

我还推荐使用jQuery .addClass()而不是.attr()

$("<div/>").addClass("dynamic")

http://jsbin.com/qufeq/1/

Answer 2

你拼错了background-color。您可能希望将来仔细检查您的拼写，因为修复这些琐碎的错误要比等待答案容易得多。

动态添加的Div不会获取CSS属性

2 个答案: