javascript/jquery

그냥 jquery 간단 정리

킹king 2021. 11. 19. 09:43
반응형

<span data-index="1">단어</span>

data-어쩌고 요소는 DOM에 정보를 저장할 수 있는 방법임.

 

 

1. data()사용

$('span').data('index', 2) // index를 2로 바꿔줌

 

2. attr() 사용

$('span').attr('data-index', 2)

가끔 data()로 썼을 때 안되는 경우 attr로 쓰면 된다.

 

 

---------------------------------

 

 

// <li> 전부
$('li')

// <li class="active">
$('li.active')

// 첫번째 <li>
$('li').eq(0)

// <li>의 이전 요소
$('li').prev();

// <li>의 다음 요소 
$('li').next();

// <li>의 바로 위 부모 요소 (바로 위★)
$('li').closest();

// <li>의 부모 중 .wrap이란 class명을 가진 요소
$('li').parents('.wrap');

// <li>내 바로 밑 자식 요소 (바로 밑★)
$('li').children();

// <li>내 <a>태그 안에 <span> 가리킴
$('li').find('a span')

 

 

4. input 수정 못하게 하기

<input type="text" readonly>

 

5. input readonly 풀기

$('input').removeAttr('readonly');

 

6. select 수정 못하게 하기

<select disabled>
	<option>옵션1</option>
</select>

 

7. select disabled 풀기

$('select').removeAttr('disabled');