Obtenir un élément par ID dans jQuery
En JavaScript, on peut utiliser la méthode document.getElementById() pour récupérer l’élément par ID. Dans jQuery, nous pouvons utiliser le $('#contents') pour obtenir l’élément par ID.
Ce tutoriel montre comment obtenir des éléments par ID en utilisant les deux méthodes.
Obtenir un élément par ID en JavaScript
Le document.getElementById() est la méthode la plus populaire utilisée pour obtenir des éléments par ID. Cette méthode est principalement utilisée dans la conception Web pour modifier la valeur d’un élément ou obtenir cet élément.
La syntaxe de cette méthode est :
document.getElementById('id')
Essayons un exemple pour obtenir l’élément par ID en utilisant cette méthode :
<!DOCTYPE html>
<html>
<head>
<title>
Select element by ID in javascript
</title>
</head>
<body style="border: 4px solid blue; min-height: 300px; text-align: center;">
<h1 style="color:blue;" id="delftstack">
DELFTSTACK
</h1>
<script>
setTimeout(function() {
document.getElementById('delftstack').style.color = "green"
}, 3000);
</script>
</body>
</html>
Le code ci-dessus obtient l’ID de l’élément h1 et change sa couleur après un délai d’attente. Voir la sortie :
Obtenir un élément par ID dans jQuery
jQuery a une méthode plus simple pour sélectionner un élément par ID. jQuery a un sélecteur d’ID qui peut sélectionner l’élément avec un ID unique.
La syntaxe de cette méthode est :
$("#idname");
Essayons l’exemple dans jQuery, qui changera l’arrière-plan de l’élément en le faisant passer par l’ID :
<!DOCTYPE html>
<html>
<head>
<title>
Select element by ID in JQuery
</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<body style="border: 4px solid blue; min-height: 300px; text-align: center;">
<h1 style="color:blue;" id="delftstack">
DELFTSTACK
</h1>
<script>
setTimeout(function () {
$('#delftstack').css("background-color", "yellow");;
}, 3000);
</script>
</body>
</html>
Voir la sortie pour ce code :
Sheeraz is a Doctorate fellow in Computer Science at Northwestern Polytechnical University, Xian, China. He has 7 years of Software Development experience in AI, Web, Database, and Desktop technologies. He writes tutorials in Java, PHP, Python, GoLang, R, etc., to help beginners learn the field of Computer Science.
LinkedIn Facebook