为什么我不能使用jQuery设置div背景？_Jquery_Html

为什么我不能使用jQuery设置div背景？

jquery html

为什么我不能使用jQuery设置div背景？,jquery,html,Jquery,Html,我是网络编程和jQuery方面的新手目的：我尝试使用以下代码将div背景设置为红色，但失败了 $（stepBox）.find（“.image”）.css（'background-color'，'red'）我可以知道有什么问题吗 <!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.min.js"></script>

我是网络编程和jQuery方面的新手

目的：
我尝试使用以下代码将div背景设置为红色，但失败了

$（stepBox）.find（“.image”）.css（'background-color'，'red'）
我可以知道有什么问题吗
<!DOCTYPE html>
<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>  

    <script>
        $(document).ready(function() {

            var stepBox = "<div class='step' id='1'>"
                        + "    <div class='summary'>summary</div>"
                        + "    <div class='image'>image</div>"
                        + "</div>";

            $(".steps").append(stepBox);

            $(stepBox).find(".image").css('background-color', 'red');
        });
    </script>
</head>

<body>
    <div class="steps">

    </div>
</body>
</html>

进一步的信息，由于“步骤”可能有很多“步骤”，所以我更喜欢操作“步骤框”中属于“步骤”的“图像”
$（'.step.image'）.css（'background-color'，'red'）也应该是可行的。（@Pratik Thakkar）
问题就在这一行：
$(stepBox).find(".image").css('background-color', 'red');

根据.find（）
文档：获取当前匹配元素集中每个元素的后代，并通过选择器、jQuery对象或元素进行筛选。这基本上意味着在当前对象中搜索与搜索匹配的任何子对象。但是stepBox
不是jquery对象或元素
您要将其更改为：
$(".steps").find(".image").css('background-color', 'red');

小提琴：
变量“stepBox”是一个字符串。jQuery需要对元素的引用。这将有助于：
 $(".steps").find(".image").css('background-color', 'red');

编辑：
对于你的评论，是的。要从字符串创建jQuery元素，可以执行以下操作：
var stepBoxEle = $.parseHTML(stepbox)[0];

不幸的是，将stepBoxEle附加到页面只会复制它，因此以后编辑它不会改变页面上的内容。您可以在附加之前编辑stepBoxEle，但如下所示：
$(stepBoxEle).find(".image").css('background-color', 'red');
$(".steps").append(stepBoxEle);

下面的代码应该可以很好地工作。您所需要做的就是在div中用class.step选择.image类
$('.step .image').css('background-color', 'red');

如果希望div中的所有元素都带有class.steps，则可以交替使用下面的代码
$('.steps .image').css('background-color', 'red');

请参阅下面的小提琴链接
谢谢，我要将“stepBox”转换为jQuery元素或对象吗？考虑到设计问题，“image”属于“step”而不是“steps”，因此我避免使用“$”（“.steps”）。直接查找（“.image”）…。在添加图像时向图像添加一个类，这样可以直接引用它。
$('.step .image').css('background-color', 'red');

$('.steps .image').css('background-color', 'red');