jQuery에서 탐색하는 방법은 무엇입니까? 여러 순회 방법에 대한 간략한 분석

jQuery에서 어떻게 탐색하나요? 다음 글에서는 객체를 탐색하는 몇 가지 jQuery 방법을 공유하겠습니다. 도움이 되기를 바랍니다.

jQuery 탐색의 여러 가지 방법

우리 모두는 js 탐색 방법이 다음과 같다는 것을 알고 있습니다. for(초기화 값, 루프 종료 조건, 단계 크기) 예:

 for (var i = 0; i < 3; i++) {//循环体}

jQuery 탐색의 용도는 다음과 같습니다.

1.jq object.each(콜백) 또는 selector.each(콜백)[추천 학습: jQuery 동영상 튜토리얼]

콜백의 반환 값은 마지막에 설명됩니다

1.1. 콜백 함수는 매개 변수를 사용하지 않습니다. (*참고: 매개 변수가 없는 이러한 종류의 콜백은 컬렉션의 각 요소 개체만 가져올 수 있지만 해당 인덱스 값은 가져올 수 없으며 이를 통해서만 개체를 ​​가져올 수 있습니다.)

- > 구문: jquery object.each(function(){});

//html
<ul id="course">
    <li>js</li>
    <li>java</li>
    <li>C++</li>
    <li>jq</li>
</ul>

//实例
$("button").click(function(){
  $("#course li").each(function(){
    alert($(this).html());//jq获取方式
    alert(this.innerHTML);//js获取方式
  });
});

1.2. 매개변수가 있는 콜백 함수(*인덱스 인덱스를 얻을 수 있으며, 요소 객체를 얻는 방법은 다음과 같이 두 가지가 있습니다)

->구문: jquery object.each(function(index,element){});

• index: 컬렉션에 있는 요소의 인덱스입니다
• element: 컬렉션에 있는 각 요소 개체입니다
• this : 컬렉션 내

//实例
  $("#course li").each(function (index, item) {
			//3.1 获取 li对象 第一种方式 this
            //alert(this.innerHTML);//js获取
            //alert($(this).html());//jq获取
            /*3.2 获取 li对象 第二种方式
             在回调函数中定义参数 index（索引）item（元素对象）*/
           // alert(index+":"+item.innerHTML);
            alert(index+":"+$(item).html());
}

2.jQuery.each(object, [callback])

콜백의 반환 값은 마지막에 설명하겠습니다

2.1. 함수는 매개변수를 취하지 않습니다(* 및 1.1 효과는 유사하며 이를 통해서만 객체를 얻을 수 있습니다)

-> 구문: $.each(object, function(){});

$.each($("#course li"),function () {
              //alert($(this).html());//jq获取方式
   			  alert(this.innerHTML);//js获取方式
         });

2.2. 매개변수가 있는 콜백 함수(*1.2와 유사하지만 다음과 같이 다르게 작성된 인덱스 index 를 얻을 수 있습니다)

->

index: 컬렉션에 있는 요소의 인덱스입니다.

• item: 컬렉션에 있는 모든 요소 개체입니다.
• this: 컬렉션에 있는 모든 요소 개체입니다.

• $.each($("#course li"),function (index,item) {
               //3.1 获取 li对象 第一种方式 this
             // alert(this.innerHTML);//js获取
             // alert($(this).html());//jq获取
              /*3.2 获取 li对象 第二种方式
               在回调函数中定义参数 index（索引）item（元素对象）*/
              //alert(index+":"+item.innerHTML);
              alert(index+":"+$(item).html());
           });

3: 제공되는 메서드입니다. jquery 3.0 버전 이후(*이해)​​ - > 구문: for (컨테이너 객체의 요소 객체)

   for (li of $("#course li")) {
            alert($(li).html());
        }

4 콜백 함수 반환 값 문제(첫 번째 및 두 번째 관련): (*보충)

true: 현재 함수가 false를 반환하면 루프가 종료됩니다(중단).

• false: 현재 함수가 true를 반환하면 이 루프를 종료하고 다음 루프를 계속합니다(계속)
• 예:

  $.each($("#course li"), function (index, item) {
            //判断如果是java，则结束循环
            if ("java" == $(item).html()) {
                //如果当前function返回为false，则结束循环(break)。
                //如果返回为true，则结束本次循环，继续下次循环(continue)
                return false;	
            }
            alert($(this).html());//此时前端页面只会弹出第一个值js
        });
        
  $.each($("#course li"), function (index, item) {
            //判断如果是java，则结束循环
            if ("java" == $(item).html()) {
                //如果当前function返回为false，则结束循环(break)。
                //如果返回为true，则结束本次循环，继续下次循环(continue)
                return true;	
            }
            alert($(this).html());//此时前端页面会依次弹出js,C++jq,不会弹出java
        });

(동영상 공유 학습:

웹 프론트엔드

)

위 내용은 jQuery에서 탐색하는 방법은 무엇입니까? 여러 순회 방법에 대한 간략한 분석의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!