위치 탐색 선택자-even / odd

imjingu·2023년 7월 22일
0

개발공부

목록 보기
185/481

탐색 선택자
기본 선택자로 선택한 요소 중 원하는 요소만 한 번 더 탐색해서 좀 더 정확하게 선택 가능
1) 위치 탐색 선택자 : 배열의 인덱스(index)를 사용해 선택
2) 속성 탐색 선택자 : 배열에 담겨진 요소 중 지정된 속성과 값으로 선택

위치탐색 선택자
even / odd 선택자
even 선택자 : 선택된 요소 중 짝수 인덱스 요소만 선택
odd 선택자 : 선택된 요소 중 홀수 인덱스 요소만 선택

기본형
$("요소 선택:even")
$("요소 선택:odd")

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script>

        $(function () {
            $("#menu li:even").css({"border 1px": "1px dashed #999", "background-color": "yellow"});
            $("#menu li:odd").css({"background-color": "cyan"});
        });

    </script>
</head>
<body>
    <h1>탐색 선택자</h1>
    <ul id="menu">
        <li>내용1</li>
        <li>내용2</li>
        <li>내용3</li>
        <li>내용4</li>
    </ul>
</body>
</html>

0개의 댓글