In JavaScript können Sie das Style-Objektattribut verwenden, um die Div-Hintergrundfarbe zu ändern. Das Syntaxformat ist „element object.style.background="color value"". Das Style-Objekt stellt eine einzelne Stildeklaration dar und kann über das Dokument oder Element, auf das der Stil angewendet wird, aufgerufen werden.
Die Betriebsumgebung dieses Tutorials: Windows 7-System, JavaScript-Version 1.8.5, Dell G3-Computer.
Idee: Durch Klicken auf ein Div wird die Hintergrundfarbe anhand der Anzahl der Klicks geändert, um die Hintergrundfarbe zu ändern. Dabei werden hauptsächlich Zahlen addiert und akkumuliert.
Code;
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js实现点击div改变背景颜色</title>
<style>
div{
background: red;
width: 100px;
height: 100px;
}
</style>
</head>
<body>
<div></div>
</body>
<script type="text/javascript">
var div=document.getElementsByTagName("div")[0];/*通过标签名div组*/
var count=0;/*计数，从0开始，每点击一下加一*/
div.onclick = function () { /*给div绑定点击函数*/
count ++;
/*判断点击的次数，来改变背景颜色*/
if(count % 3==1){
this.style.background="yellow"
}else if(count % 3==0){
this.style.background="red"
}else {
this.style.backgroundColor="#ff9000"
}
}
</script>
</html>[Empfohlenes Lernen: Javascript-Tutorial für Fortgeschrittene]
Das obige ist der detaillierte Inhalt vonSo ändern Sie die Hintergrundfarbe von Div mit Javascript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
So fangen Sie Zeichenfolgen in der Shell ab
Was bedeutet OEM?
Welche Arten von Systemarchitekturen gibt es?
Methode zur Migration einer MySQL-Datenbank
Welche Methoden gibt es zum Neustarten von Anwendungen in Android?
Implementierungsmethode für die Python-Online-Wiedergabefunktion
Java ruft Webservice auf
So lösen Sie das Problem, dass Teamviewer keine Verbindung herstellen kann
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
