Jquery 체인 프로그래밍이란 무엇입니까?

jquery에서 체인 프로그래밍은 항상 동일한 요소에 대해 함수 작업을 수행하는 것을 의미합니다. 체인 프로그래밍은 여러 줄의 코드를 한 줄의 코드로 병합하는 것입니다. 병합된 각 메서드에서 반환되는 결과는 연결되기 전의 요소 개체입니다. 프로그래밍에서 구문은 "Element object.Method().Method().Method()...;"입니다.

이 튜토리얼의 운영 환경: Windows 10 시스템, jquery 버전 3.6.0, Dell G3 컴퓨터.

jquery 체인 프로그래밍이란 무엇입니까

체인 프로그래밍의 핵심은 객체의 모든 메서드가 현재 객체를 반환한다는 것입니다.

체인 프로그래밍: 여러 줄의 코드가 한 줄의 코드로 병합됩니다. 전제 조건은 코드 줄이 개체인 경우에만 체인 프로그래밍을 수행할 수 있다는 것입니다. method().method().Method();......

1.체인 프로그래밍

jQuery에서는 항상 같은 요소에 대해 함수 연산을 수행한다면 를 사용하면 됩니다. 함수 연산 이름 , 계속 쓰세요.

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

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

举例：

				//这是普通的事件绑定
				$("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")
				})

实现链式编程的核心，是函数调用结束之后返回的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("鼠标失焦事件")			})

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

2. 일반적으로 사용되는 바인딩 이벤트 함수의 체인 프로그래밍

예:

				//普通写法
				$("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("鼠标离焦事件")
				}})

체인 프로그래밍의 핵심은 함수 호출이 끝난 후 반환되는 this 개체입니다. 현재 발신자. 여기서 $("button").click(function(){})은 $("button" )this 객체를 반환합니다. /code>, 이것과 다음이 결합되어 $("button").mouseenter(function() {})의 함수 호출을 구현합니다. 위는 체인 프로그래밍 단계의 일반적인 구현입니다. .

3. on 함수의 체인 프로그래밍

예:

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

여기서 on 함수 체인 프로그래밍은 현재 호출된 개체를 나타내는 this 키워드가 암시적으로 반환됩니다. first on 함수 호출이 완료된 후 반환된 this 키워드는 $("#btn1")를 나타내므로 나중에 on 함수를 추가하는 것이 논리적입니다.

4. 바인드 함수 체인 프로그래밍

예: rrreee

여기서 바인드 함수 체인 프로그래밍은 바인드 함수에 여러 매개 변수를 동시에 넣기 때문에 각 매개 변수는 사전에 저장됩니다. 동일한 형식이므로 동시에 병렬 매개변수로 바인드 함수에 배치될 수 있습니다. 🎜🎜🎜🎜5. 혼합 사용 🎜🎜🎜예: 🎜rrreee🎜실행 결과: 🎜🎜🎜🎜비디오 튜토리얼 권장 사항: 🎜jQuery 비디오 튜토리얼🎜🎜🎜

위 내용은 Jquery 체인 프로그래밍이란 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!