Table des matières
Qu'est-ce que la programmation en chaîne jquery
Maison interface Web Questions et réponses frontales Qu'est-ce que la programmation en chaîne jquery

Qu'est-ce que la programmation en chaîne jquery

Jun 24, 2022 pm 04:58 PM
jquery

Dans jquery, la programmation en chaîne fait référence à l'exécution constante d'opérations de fonction sur le même élément ; la programmation en chaîne consiste à fusionner plusieurs lignes de code en une seule ligne de code. Le résultat renvoyé par chaque méthode fusionnée est un objet élément avant que le chaînage puisse être. effectuée. En programmation, la syntaxe est "Element object.Method().Method().Method()...;".

Qu'est-ce que la programmation en chaîne jquery

L'environnement d'exploitation de ce tutoriel : système Windows 10, jquery version 3.6.0, ordinateur Dell G3.

Qu'est-ce que la programmation en chaîne jquery

Le cœur de la programmation en chaîne est que chaque méthode de l'objet renvoie l'objet actuel.

Programmation en chaîne : plusieurs lignes de code sont fusionnées en une seule ligne de code. La condition préalable est de reconnaître si la ligne de code renvoie un objet. Ce n'est que s'il s'agit d'un objet que la programmation en chaîne peut être effectuée. method().method(). Method();......

1. Programmation en chaîne

Dans jQuery, si vous effectuez toujours des opérations de fonction sur le même élément, vous pouvez utiliser . Nom de l'opération de fonction , continuez à écrire.

.函数操作名,一直写下去。

二、常用绑定事件函数的链式编程

举例:

				//这是普通的事件绑定
				$("button").click(function() {
					console.log("1")
				})

				$("button").mouseenter(function() {
					console.log("2")
				})

				$("button").mouseleave(function() {
					console.log("3")
				})

				//与上文功能相同的链式编程
				$("button").click(function() {
					console.log("1")
				}).mouseenter(function() {
					console.log("2")
				}).mouseleave(function() {
					console.log("3")
				})
Copier après la connexion

实现链式编程的核心,是函数调用结束之后返回的this对象,指的是当前调用者。这里的$("button").click(function(){})调用结束之后,返回this对象,它相当于$("button"),这样和后面的合在一起就实现了$("button").mouseenter(function() {})的函数调用,以上就是链式编程实现的一般步骤。

三、on函数的链式编程

举例:

			//普通写法			$("#btn1").on("click",function(){				console.log("点击事件")			})			$("#btn1").on("mouseenter",function(){  //注意这里的on函数的链式编程				console.log("鼠标聚焦事件")			})			$("#btn1").on("mouseleave",function(){  //注意这里的on函数的链式编程				console.log("鼠标失焦事件")			})						//链式编程			$("#btn1").on("click",function(){				console.log("点击事件")			}).on("mouseenter",function(){  //注意这里的on函数的链式编程				console.log("鼠标聚焦事件")			}).on("mouseleave",function(){  //注意这里的on函数的链式编程				console.log("鼠标失焦事件")			})
Copier après la connexion

这里的on函数链式编程,函数调用结束之后,会隐式返回this关键字,表示当前调用的对象,这里第一个on函数调用结束之后,返回的this关键字表示的就是$("#btn1")

2. Programmation en chaîne des fonctions d'événement de liaison couramment utilisées

Exemple :

				//普通写法
				$("button").bind({"click":function(){
					console.log("点击事件")
				}})
				$("button").bind({"mouseenter":function(){
					console.log("鼠标聚焦事件")
				}})
				$("button").bind({"mouseleave":function(){
					console.log("鼠标离焦事件")
				}})

				//链式编程
				$("button").bind({"click":function(){
					console.log("点击事件")
				},
				"mouseenter":function(){
					console.log("鼠标聚焦事件")
				},
				"mouseleave":function(){
					console.log("鼠标离焦事件")
				}})
Copier après la connexion

Le cœur de la programmation en chaîne est l'objet this renvoyé après la fin de l'appel de fonction, faisant référence au appelant actuel. Ici, $("button").click(function(){}) renvoie l'objet this, qui est équivalent à $("button" ), ceci et les suivants sont combinés pour réaliser l'appel de fonction de $("button").mouseenter(function() {}) Ce qui précède est l'implémentation générale de l'étape de programmation en chaîne. .

3. Programmation en chaîne de la fonction on

Exemple :

	//混合使用
	$("button").bind({"click":function(){
					console.log("点击事件")
				}})
				$("button").bind({"mouseenter":function(){
					console.log("鼠标聚焦事件")
				}}).mouseleave(function(){
					console.log("混合使用的离焦事件")
				})
Copier après la connexion

La programmation en chaîne de fonctions ici une fois l'appel de fonction terminé, le mot-clé this sera implicitement renvoyé, indiquant l'objet actuellement appelé. first Une fois l'appel de la fonction on terminé, le mot-clé this renvoyé représente $("#btn1"), il est donc logique d'ajouter la fonction on par la suite.


Quest-ce que la programmation en chaîne jquery4. Programmation de la chaîne de fonctions de liaison

Exemple : rrreee

La programmation de la chaîne de fonctions de liaison place ici plusieurs paramètres dans la fonction de liaison en même temps. En effet, chaque paramètre est basé sur un dictionnaire stocké dans. le même format, il peut donc être placé dans la fonction bind en tant que paramètre parallèle en même temps. Vous devez vous souvenir de ce format. 🎜🎜🎜🎜5. Utilisation mixte 🎜🎜🎜Exemple : 🎜rrreee🎜Résultats d'exécution : 🎜🎜🎜🎜Recommandation de didacticiel vidéo : 🎜Tutoriel vidéo jQuery🎜🎜🎜

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

Article chaud

Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD
Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Article chaud

Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD
Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Tags d'article chaud

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Explication détaillée des méthodes de référence jQuery : guide de démarrage rapide Explication détaillée des méthodes de référence jQuery : guide de démarrage rapide Feb 27, 2024 pm 06:45 PM

Explication détaillée des méthodes de référence jQuery : guide de démarrage rapide

Comment utiliser la méthode de requête PUT dans jQuery ? Comment utiliser la méthode de requête PUT dans jQuery ? Feb 28, 2024 pm 03:12 PM

Comment utiliser la méthode de requête PUT dans jQuery ?

Comment supprimer l'attribut height d'un élément avec jQuery ? Comment supprimer l'attribut height d'un élément avec jQuery ? Feb 28, 2024 am 08:39 AM

Comment supprimer l'attribut height d'un élément avec jQuery ?

Conseils jQuery : modifiez rapidement le texte de toutes les balises a de la page Conseils jQuery : modifiez rapidement le texte de toutes les balises a de la page Feb 28, 2024 pm 09:06 PM

Conseils jQuery : modifiez rapidement le texte de toutes les balises a de la page

Analyse approfondie : les avantages et les inconvénients de jQuery Analyse approfondie : les avantages et les inconvénients de jQuery Feb 27, 2024 pm 05:18 PM

Analyse approfondie : les avantages et les inconvénients de jQuery

Utilisez jQuery pour modifier le contenu textuel de toutes les balises Utilisez jQuery pour modifier le contenu textuel de toutes les balises Feb 28, 2024 pm 05:42 PM

Utilisez jQuery pour modifier le contenu textuel de toutes les balises

Comprendre le rôle et les scénarios d'application de eq dans jQuery Comprendre le rôle et les scénarios d'application de eq dans jQuery Feb 28, 2024 pm 01:15 PM

Comprendre le rôle et les scénarios d'application de eq dans jQuery

Comment savoir si un élément jQuery possède un attribut spécifique ? Comment savoir si un élément jQuery possède un attribut spécifique ? Feb 29, 2024 am 09:03 AM

Comment savoir si un élément jQuery possède un attribut spécifique ?

See all articles