Heim > Artikel > Web-Frontend > So stellen Sie sicher, dass sich das Hintergrundbild in JQuery nicht wiederholt
So stellen Sie sicher, dass sich das Hintergrundbild in JQuery nicht wiederholt
- 青灯夜游Original
- 2022-06-10 15:25:283067Durchsuche
Zwei Möglichkeiten, das Hintergrundbild nicht wiederholbar zu machen: 1. Verwenden Sie css(), um dem Element das Attribut „background-repeat“ hinzuzufügen. Die Syntax lautet „$(“angegebenes Element“).css(“background-repeat“, „keine Wiederholung“)“. 2. Verwenden Sie attr(), um dem Element den Hintergrundwiederholungsstil hinzuzufügen. Die Syntax lautet „$(„angegebenes Element“).attr(„Stil“, „Hintergrundwiederholung: keine Wiederholung“)“.
Die Betriebsumgebung dieses Tutorials: Windows7-System, JQuery3.6.0-Version, Dell G3-Computer.
? passendes Element. Verwenden Sie einfach diese Methode, um dem Element das Attribut „background-repeat“ hinzuzufügen und den Attributwert auf „no-repeat“ zu setzen.<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="./js/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
$("button").click(function() {
$("div").css("background-repeat","no-repeat");
});
});
</script>
<style>
div{
height: 150px;
background-image: url(img/nz.png);
}
</style>
</head>
<body>
<div></div>
<br>
<button>让背景图片不重复</button>
</body>
</html>Methode 2: Verwenden Sie attr(), um das Stilattribut festzulegen und den Hintergrundwiederholungsstil hinzuzufügen. Die Methode attr() kann den Attributwert des ausgewählten Elements festlegen. Verwenden Sie einfach diese Methode, um das Stilattribut des Elements festzulegen und den Attributwert auf „background-repeat:no-repeat“ zu setzen. Kerncode implementieren:
$(document).ready(function() {
$("button").click(function() {
$("div").attr("style","background-repeat:no-repeat");
});
});
[Empfohlenes Lernen:
jQuery-Video-Tutorial
Web-Front-End-Video
]Das obige ist der detaillierte Inhalt vonSo stellen Sie sicher, dass sich das Hintergrundbild in JQuery nicht wiederholt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!