Méthode JS pour obtenir la hauteur d'un DIV inconnu

L'exemple de cet article décrit la méthode JS pour obtenir la hauteur d'un DIV inconnu. Partagez-le avec tout le monde pour votre référence, les détails sont les suivants :

La hauteur de l'élément peut être obtenue via l'attribut clientHeight de l'élément, tel que :

var height = element.clientHeight;

Les limites de cette approche :

1 Si l'attribut display de l'élément est défini sur none, alors le résultat obtenu est 0

2. Dans le navigateur Safari, vous devez utiliser : element.offsetHeight pour obtenir la hauteur réelle, il s'agit d'un bug dans le navigateur Safari

Voici la méthode fournie par Prototype, qui est compatible avec divers navigateurs et peut également correctement obtenir la taille de l'élément lorsque l'élément est masqué. Pour référence :

getDimensions: function(element) {
  element = $(element);
  var display = $(element).getStyle('display');
  if (display != 'none' && display != null) // Safari bug
   return {width: element.offsetWidth, height: element.offsetHeight};
  // All *Width and *Height properties give 0 on elements with display none,
  // so enable the element temporarily
  var els = element.style;
  var originalVisibility = els.visibility;
  var originalPosition = els.position;
  var originalDisplay = els.display;
  els.visibility = 'hidden';
  els.position = 'absolute';
  els.display = 'block';
  var originalWidth = element.clientWidth;
  var originalHeight = element.clientHeight;
  els.display = originalDisplay;
  els.position = originalPosition;
  els.visibility = originalVisibility;
  return {width: originalWidth, height: originalHeight};
}

J'espère que cet article sera utile à tout le monde dans la programmation JavaScript.

Pour plus de méthodes JS permettant d'obtenir des articles liés à une hauteur DIV inconnue, veuillez faire attention au site Web PHP chinois !