Menu



Manage

파일 목록
Study_Web > 이후/jquery/ex11-9.html Lines 40 | 1.3 KB
다운로드

                        <!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../js/jquery.js"></script>
    <script>
        $(function () {
            $("#inner_1 p:contains(내용1)").css({ "background-color": "#ff0" });
            $("#inner_1 p:has(strong)").css({ "background-color": "#0ff" });
            $("#outer_wrap").contents().css({ "border": "1px dashed #00f" });
            $("#inner_2 p").not(":first").css({ "background-color": "#0f0" });
            $("#inner_2 p").eq(2).css.end()({ "color": "#f00" });
        });
    </script>
</head>

<body>
    <div id="outer_wrap">
        <h1>콘텐츠 탐색 선택자</h1>
        <section id="inner_1">
            <h1>contains( ), contents( ), has( )</h1>
            <p><span>내용1</span></p>
            <p><strong>내용2</strong></p>
            <p><span>내용3</span></p>
        </section>
        <section id="inner_2">
            <h1>not( ), end( )</h1> <!-- end 는 전이라 이전이다-->
            <p>내용4</p>
            <p>내용5</p>
            <p>내용6</p>
        </section>
    </div>
</body>


</html>