Supprime les balises HTML et PHP d'une chaîne
La méthode attr() définit ou retourne les valeurs d'attributs de l'éléments choisis
La méthode attr() définit ou retourne les valeurs d'attributs de l'éléments choisis.
Cette méthode fonctionne différemment selon les paramètres.
Retourner la valeur d'un attribut pour l'élément sélectionné.
Syntaxe
$(selecteutr).attr(attribut)
|
Paramètre |
Description |
|---|---|
|
attribut |
Spécifie l'attribut à récupérer la valeur de |
Exemple : 📝 Copier le code
<!DOCTYPE html>
<html lang="fr">
<head>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
alert("La largeur de cette
image est : " + $("img").attr("width")+" sa hauteur est : " +
$("img").attr("height"));
});
});
</script>
</head>
<body>
<img
src="http://upload.wikimedia.org/wikipedia/en/thumb/c/c8/Houses_on_the_caldera%2C_Santorini.jpg/170px-Houses_on_the_caldera%2C_Santorini.jpg"
alt="Pulpit Rock" width="284" height="213" />
<br />
<button>Dimensions de l'image</button>
</body>
</html>
Définir l'attribut et la valeur des éléments sélectionnés.
Syntaxe
$(selecteurr).attr(attribut,value)
|
Paramètre |
Description |
|---|---|
|
attribut |
Indique le nom de l'attribut |
|
value |
Indique la valeur de l'attribut |
Exemple : 📝 Copier le code
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>jQuery demo
</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("img").attr("width","150");
});
});
</script>
</head>
<body>
<img
src="http://upload.wikimedia.org/wikipedia/en/thumb/c/c8/Houses_on_the_caldera%2C_Santorini.jpg/170px-Houses_on_the_caldera%2C_Santorini.jpg"
alt="Pulpit Rock" width="284" />
<br />
<button>Miniaturiser l'image</button>
</body>
</html>
En utilisant une fonction pour définir la valeur d'attribut pour les éléments sélectionnés.
Syntaxe
$(selecteurr).attr(attribut,function(index,oldvalue))
|
Paramètre |
Description |
|---|---|
|
attribut |
Indique le nom de l'attribut |
|
fonction (index, oldValue) |
Indique une fonction qui renvoie la valeur d'attribut à définir.
|
Exemple : 📝 Copier le code
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>jQuery demo
</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("img").attr("width",function(n,v){
return v-50;
});
});
});
</script>
</head>
<body>
<center>
<img
src="http://upload.wikimedia.org/wikipedia/en/thumb/c/c8/Houses_on_the_caldera%2C_Santorini.jpg/170px-Houses_on_the_caldera%2C_Santorini.jpg"
alt="Pulpit Rock" width="284" />
<br />
<button>Miniaturiser l'image</button>
</center>
</body>
</html>
Définir un ou plusieurs attributs et valeurs pour les éléments sélectionnés.
Syntaxe
$(selecteur).attr({attribut:value, attribut:value, ...})
Exemple :
Exemple : 📝 Copier le code
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>jQuery demo
</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script
type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("img").attr({width:"150",height:"100"});
});
});
</script>
</head>
<body>
<center>
<img
src="http://upload.wikimedia.org/wikipedia/en/thumb/c/c8/Houses_on_the_caldera%2C_Santorini.jpg/170px-Houses_on_the_caldera%2C_Santorini.jpg" alt="Pulpit Rock" width="284" height="213" /><br
/>
<button>Miniaturiser l'image</button>
</center>
</body>
</html>