Pourquoi ma fonction JavaScript « animer » ne fonctionne-t-elle pas dans Chrome, mais fonctionne dans IE ?

La fonction JS animate ne fonctionne pas dans Chrome, mais fonctionne dans IE

La fonction JavaScript fournie animate ne fonctionne pas dans Chrome mais fonctionne comme prévu dans Internet Explorer . Pour résoudre ce problème, il est nécessaire d'examiner les contraintes et les conflits potentiels qui surviennent lors de l'utilisation des attributs de contenu du gestionnaire d'événements.

Le nœud du problème provient de l'observation de votre fonction globale window.animate par Element.prototype. .animer. Cette nouvelle fonction, introduite dans Web Animations, étend l'interface Element, permettant des animations directement sur les éléments de la manière suivante :

elem.animate({ color: 'red' }, 2000);

Lors de la gestion d'événements à l'aide d'attributs de contenu, la portée de l'élément cible remplace la portée globale. . Par conséquent, le nom de votre fonction animer est en conflit avec la nouvelle méthode Element.animate.

Pour résoudre ce problème, il existe deux approches possibles :

1. Renommer votre fonction :

En changeant le nom de votre fonction, vous pouvez éviter le conflit avec Element.prototype.animate. Par exemple, vous pouvez utiliser :

function animate__() {
  var div = document.getElementById('demo');
  div.style.left = "200px";
  div.style.color = "red";
}

2. Utiliser la méthode apply :

Vous pouvez également utiliser la méthode apply pour spécifier explicitement la portée correcte pour votre fonction d'animation. Cette approche est particulièrement utile si vous devez conserver le nom animate.

Modifiez votre code comme suit :

document.getElementById('demo').onclick = function() {
  animate.apply(document.getElementById('demo'));
};

Cette ligne applique la portée correcte à votre fonction d'animation globale lorsqu'elle est déclenchée par l'événement onclick.

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!