如何使用 jQuery 设置 CSS background-image 属性
答案:使用jQuery CSS()
方法
要使用 jQuery CSS()
方法设置元素的 CSS background-image
属性,您需要使用 url()
函数表示法指定完整的属性值。
例如,如果您将图像 URL 存储在 JavaScript 变量中,那么在 CSS()
方法中,您需要设置类似这样的值以使其工作:
示例
<!DOCTYPE html>
<html lang="en">
<head>
<title>jQuery 设置 background-image CSS 属性</title>
<style>
.box{
width: 500px;
height: 300px;
border: 5px solid #333;
}
</style>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
/* 单击按钮设置div的背景图像 */
$("button").click(function(){
var imageUrl = "images/sky.jpg";
$(".box").css("background-image", "url(" + imageUrl + ")");
});
});
</script>
</head>
<body>
<div class="box"></div>
<p><button type="button">Set Background Image</button></p>
</body>
</html>
FAQ 相关问题解答
以下是与此主题相关的更多常见问题解答: