使用jQuery和PHP更改现有CSS类属性

我是新来的jQuery！ 我有一个名为“Slider.CSS”的CSS文件，其中包含以下代码：

.banner1 {
    /*background: url(../images/bnr1.jpg) no-repeat 0px 0px;*/
    background-size: cover;
    min-height: 650px;
}

.banner2 {
   /* background: url(../images/bnr2.jpg) no-repeat 0px 0px;*/
    background-size: cover;
    min-height: 650px;
}

.banner3 {
   /* background: url(../images/bnr3.jpg) no-repeat 0px 0px;*/
    background-size: cover;
    min-height: 650px;
} 

我想要的是根据我从数据库获得的数据更改名为home.ctp的页面中背景的url，所以我尝试了以下方法：

  <?php $i=1; ?>
     <?php foreach ($query as $slider): ?> // query contain 3 items
         <div  class="slid banner<?= $i; ?>">
               <div class="caption">
                       <h3><?= $slider->titre; ?></h3>
                        <p><?= $slider->contenue; ?></p>
                        <a href="#" class="button">know more</a>
                  </div>
            </div>
                <script>
                   // alert(".banner<?= $i; ?>");
                    $(".banner<?= $i; ?>").css({"background": "url(../images/<?= $slider->url ?>) no-repeat 0px 0px;"})
                </script>
                <?php $i++; ?>;
            <?php endforeach; ?>

//查询包含3项
基本上，你做错了。您不需要也不应该为此使用jQuery

这就是你想要的：


.banner{
背景尺寸：封面；
最小高度：650px；
}
//查询包含3项
您不需要jQuery来实现这一点。如果
$slider->url
包含背景图像的url，只需执行以下操作：

<?php $i = 1; foreach ($query as $slider): ?>
  <div class="slid banner<?php echo $i; ?>" style="background-image: url(<?php echo $slider->url; ?>)">
    // ...
  </div>
<?php $i++; endforeach; ?>


只是一个一般性的建议：如果不是为了琐碎的代码，请不要将服务器端代码（php）与客户端代码（html/js）混合使用……并且，您不希望slider.css文件被更改，对吗<代码> $（元素）.CSS（属性，值）< /> >只更改DOM……顺便说一下，如果您需要在循环中使用索引，请考虑使用<代码> < <代码> >而不是<代码>前缀。我从
slider.css
中删除了所有的类（banner1/2/3），并将它们添加到div的样式选项中，现在就可以使用了！