jquery li each 사용 Attribute 참조하기.

<ul>
	<li class="top" data-top="1" data-name="1번"><span>1번</span></li>
	<li class="top" data-top="2" data-name="2번"><span>2번</span></li>
	<li class="top" data-top="3" data-name="3번"><span>3번</span></li>
	<li class="top" data-top="4" data-name="4번"><span>4번</span></li>
	<li class="top" data-top="5" data-name="5번"><span>5번</span></li>
	<li class="top" data-top="6" data-name="6번"><span>6번</span></li>
</ul>    

위와 같은 li리스트가 있을 경우 아래와 같이 li의 attribute를 참조하여 class가 "top" 인 모든 li를 each로 돌면서

li의 data-top이 "2" 인 것의 data-name값을 콘솔에 찍는다.

$('li[class="top"]').each(function(index,item){
  if(item.getAttribute("data-top") == '2'){
  	console.log(item.getAttribute("data-name").trim());
  }
});

위의 결과로 "2번"이 출력 된다.

//li선택자를 여러개 줄경우

$('li[class="top"][data-top="1"][data-name="2번"]')

 

//li의 가장 첫번째의 span에 click 이벤트 발생.

$('.list_category_depth1 > li').first().find("span").click();