Cet article est une petite compétence de production de pages Web utilisant JS. Il est utilisé dans de nombreux endroits. Il peut changer la couleur des pages HTML via JS. Si vous êtes intéressé, apprenez-le.
Jetons d'abord un coup d'œil aux rendus de démonstration spécifiques
Ce qui suit est le code complet de la page HTML, vous pouvez le tester.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.big_box{
width: 500px;
height: 500px;
border: 1px solid black;
}
.big_box input{
margin-left: 60px;
}
</style>
<script>
function Change_red(){
var Red=document.getElementById("change_style");
Red.style.backgroundColor="red";
}
function Change_blue(){
var Blue=document.getElementById("change_style");
Blue.style.backgroundColor="blue";
}
function Change_green(){
var Green=document.getElementById("change_style");
Green.style.backgroundColor="green";
}
</script>
</head>
<body>
<p class="big_box" id="change_style">
<input type="button" value="变为红色" onclick="Change_red()">
<input type="button" value="变为蓝色" onclick="Change_blue()">
<input type="button" value="变为绿色" onclick="Change_green()">
</p>
</body>
</html>J'ai compilé ce qui précède pour vous, j'espère que cela vous sera utile à l'avenir.
Articles connexes :
Comment utiliser ngrok+express pour résoudre les problèmes de débogage de l'interface WeChat
Comment utiliser les tables element-ui pour implémenter la fonctionnalité cellulaire Modifier
Comment utiliser vue-cli pour écrire un plug-in vue
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
