Maison  >  Article  >  interface Web  >  Comment fonctionne « ceci » dans jQuery et quelles sont les différentes façons de l'utiliser ?

Comment fonctionne « ceci » dans jQuery et quelles sont les différentes façons de l'utiliser ?

Linda Hamilton
Linda Hamiltonoriginal
2024-10-26 10:14:30156parcourir

  How Does

Comprendre la signification et l'utilisation de "this" dans jQuery

Le mot-clé "this" en JavaScript est un concept puissant qui permet une flexibilité programmation orientée objet. Dans jQuery, "this" est fréquemment utilisé pour faire référence à l'élément DOM qui sert de cible à un appel de fonction particulier, comme dans les rappels d'événements.

"this" dans les rappels d'événements jQuery

Dans les rappels d'événements jQuery, "this" représente généralement l'élément DOM qui a déclenché l'événement. Cela vous permet de manipuler facilement les attributs de l'élément, comme définir son style ou le masquer :

$("div").click(function() {
    this.style.color = "red";
    $(this).hide();
});

"this" dans les fonctions jQuery

Diverses fonctions jQuery qui itérer sur les éléments DOM accepte également une fonction comme argument. Dans ces fonctions, "this" représente à nouveau l'élément DOM actuel. Par exemple, la fonction "html()" vous permet de définir le contenu de chaque élément correspondant :

$("#foo div").html(function() {
    return this.className;
});

"this" dans la méthode ".each()" de jQuery

La méthode ".each()" sur jQuery permet de parcourir un tableau d'éléments. Dans la fonction de rappel fournie à ".each()", "this" fait référence à l'élément actuel dans le tableau :

jQuery.each(["one", "two", "three"], function() {
    alert(this);
});

Comprendre "this" de manière générique en JavaScript

En général, « ceci » en JavaScript fait référence à l'objet contre lequel une fonction est appelée. Il est déterminé par le contexte dans lequel la fonction est invoquée, et non par l'endroit où elle est définie.

Généralement, "this" est défini en appelant une fonction en tant que propriété d'un objet :

var obj = {
    firstName: "Fred",
    foo: function() {
        alert(this.firstName);
    }
};
obj.foo(); // alerts "Fred"

"this" et mode strict

Dans le mode strict d'ES5, "this" peut avoir n'importe quelle valeur, pas seulement un objet. Si "this" n'est pas explicitement défini, la valeur par défaut est l'objet global (qui est l'objet "window" dans les navigateurs).

Méthodes supplémentaires pour définir "this"

En JavaScript, il existe deux autres méthodes pour définir la valeur de "this" :

  • .call() : Définit "this" au premier argument, en passant n'importe quel arguments restants à la fonction.
  • .apply() : Similaire à ".call()", mais accepte les arguments sous forme de tableau.

En mode libre et en mode strict

Le comportement de « ceci » diffère entre le mode libre et le mode strict. En mode libre, si "this" n'est pas explicitement défini, la valeur par défaut est l'objet global. En mode strict, "this" peut avoir n'importe quelle valeur, et ne pas le définir explicitement entraînera "indéfini".

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:
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