Maison > interface Web > tutoriel CSS > Le .css() de jQuery gère-t-il automatiquement les préfixes du navigateur ?

Le .css() de jQuery gère-t-il automatiquement les préfixes du navigateur ?

DDD
Libérer: 2024-11-11 18:25:03
original
1014 Les gens l'ont consulté

Does jQuery's .css() Automatically Handle Browser Prefixes?

JQuery gère-t-il automatiquement les préfixes du navigateur avec .css() ?

La méthode .css() de jQuery simplifie le processus de manipulation des propriétés CSS. Mais une question courante se pose : applique-t-il automatiquement les préfixes de fournisseur spécifiques au navigateur ?

Réponse :

Dans les versions antérieures de jQuery, l'ajout de préfixes de fournisseur n'était pas géré automatiquement. Cependant, avec la sortie de jQuery 1.8.0, cette fonctionnalité a été introduite. Par conséquent, la méthode .css() de jQuery gère désormais de manière transparente les préfixes des fournisseurs pour les propriétés CSS.

Implications pour les développeurs :

Cette gestion automatisée des préfixes simplifie votre code en éliminant le vous devez les ajouter manuellement. Cependant, il est important de noter ce qui suit :

  • Si vous utilisez une version obsolète de jQuery, vous devrez implémenter vous-même les préfixes du fournisseur ou utiliser la méthode .cssHooks() de jQuery.
  • Les propriétés CSS personnalisées peuvent nécessiter l'ajout manuel de préfixes de fournisseur.

Exemple de code pour les versions antérieures de jQuery :

Le code suivant montre comment utiliser jQuery .cssHooks() pour ajouter des préfixes de fournisseur dans les versions antérieures :

(function($) {
  function styleSupport(prop) {
    var prefixes = ['Moz', 'Webkit', 'O', 'ms'],
        div = document.createElement('div');

    if (prop in div.style) {
      supportedProp = prop;
    } else {
      for (var i = 0; i < prefixes.length; i++) {
        vendorProp = prefixes[i] + capProp;
        if (vendorProp in div.style) {
          supportedProp = vendorProp;
          break;
        }
      }
    }

    div = null;
    $.support[prop] = supportedProp
    return supportedProp
  }

  var myCssPropName = styleSupport("myCssPropName");

  if (myCssPropName &amp;&amp; myCssPropName !== 'myCssPropName') {
    $.cssHooks["myCssPropName"] = {
      get: function(elem, computed, extra) {
        return $.css(elem, myCssPropName);
      },
      set: function(elem, value) {
        elem.style[myCssPropName] = value;
      }
    };
  }
})(jQuery);
Copier après la connexion

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!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal