주니어 개발자가 되는 중입니다...loading....

Jquery - 배열 조작하기 본문

Jquery

Jquery - 배열 조작하기

휼양 2022. 11. 10. 21:00

jQuery에서 선택자로 element를 가져오면 배열 방식으로 가져온다.


배열 탐색 메소드


 $("선택자").each(function(인덱스번호,value){};) 

  element 순회하는 방법 

 $.each(배열변수명, function(i,v){}) 

   배열순회하는 방법

 $.extend(변수명1변수명2)

   객체를 병합해주는 함수

 const 변수명=$.noConflict();

   $충동방지하기

 

 

 

1. $("선택자").each(function(i,v){};) 

<div id="container">
        <ul>
            <li>item-1</li>
            <li>item-2</li>
            <li>item-3</li>
            <li>item-4</li>
        </ul>
 </div>

    <script>
        $('div#container>ul>li').each(function(index,val){
            console.log(val);
            console.log(index);
        })
    </script>

 

 

 

2.  $.each(배열변수명, function(i,v){}) 

 <script>
 const numArr=["가","나","다","라","마"];
 
 	$.each(numArr,function(indax,val){
                    console.log(val);
 	})     
                
</script>

 

 

3. $.extend(변수명1, 변수명2)

<script>
//1.js로 합치기(사용권장)
  let obj = {name:"유병승", age:19};
  let obj2={items:[1,2,3,4,5],data:"test"};
  let total={...obj,...obj2};
  console.log(total);

 //2. jquery로 불러와서 합쳐주기(객체를 합치기 위해서 굳이 jquery를 가져와서 합칠 필요는 없다)
   total=$.extend(obj,obj2);
   console.log(total);
</script>

 

 

4. 충돌방지하기

<h3>$충돌방지하기</h3>
    <p>
        $를 사용하지 못하는 페이지에서 $를 다른 문자로 대체해주는 기능
        $.noConflict()함수이용
    </p>
<script>
        const jq=$.noConflict();
        //$를 쓸려면 다 jq로 바꿔 사용해야한다
</script>

즉 더이상 $("선택자")를 쓰는 것이 아닌 jq("선택자") 로 써야한다

 

Comments