OUJOOD.COM
Définition et Usage La méthode innerHeight()
La méthode .innerHieght() est utilisée pour Obtenir la hauteur calculée actuelle pour le premier élément dans l'ensemble des éléments sélectionnés, y compris le padding, mais sans les frontières.
Syntaxe
$(sélecteur) .innerHeight()
La méthode .innerHeight() renvoie la hauteur de l'élément, y compris le padding haut et bas de l'élément, en pixels. La méthode .innerHeight() n'est pas applicable aux objets window et document ; dans ce cas, utilisez plutôt .height() .
Exemple : Obtenez l'innerHeight d'un paragraphe.
Exemple : 📝 Copier le code
<!DOCTYPE html>
<html>
<head>
<script" src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script">
$(document).ready(function(){
$("button").click(function(){
var p = $("p:first");
$("p:last").html( "La hauteur calculée est: <span>" + p.innerHeight() +"</span> px");
});
});
</script>
<style>p { margin:10px;padding:5px;border:2px solid #666; }
span{color: #f00}</style>
</head>
<body>
<p>Ceci est un paragraphe.</p>
<button>Calculer la hauteur </button>
</body>
</html>
Définition et Usage La méthode innerWidth()
La méthode .innerHieght() est utilisée pour Obtenir la largeur calculée actuelle pour le premier élément dans l'ensemble des éléments sélectionnés, y compris le padding, mais sans les frontières.
Syntaxe
$(sélecteur) .innerWidth()
La méthode .innerWidth() renvoie la largeur de l'élément, y compris le padding gauche et droit de l'élément, en pixels. La méthode .innerWidth() n'est pas applicable aux objets window et document ; dans ce cas, utilisez plutôt .width() .
Exemple : Obtenez l'innerWidth d'un paragraphe.
Exemple : 📝 Copier le code
<!DOCTYPE html>
<html>
<head>
<script" src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script">
$(document).ready(function(){
$("button").click(function(){
var p = $("p:first");
$("p:last").html( "La largeur calculée est: <span>" + p.innerWidth() +"</span> px");
});
});
</script>
<style>p { margin:10px;padding:5px;border:2px solid #666; }
span{color: #f00}</style>
</head>
<body>
<p>Ceci est un paragraphe.</p>
<button>Calculer la largeur </button>
</body>
</html>
Par gerywa 25 juillet 2014