소스

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="js/jquery-1.11.3.js"></script>
    <script>
        $(function(){
            $('a[title]').css("background-color","yellow");//'title을 가지고있는 a태그'가 선택자
            $('a[href="http://naver.com"]').css("color","red");
            $("a[href^='mailto']").css('border',"1px solid red");//mailto 시작하는
            $("a[href$='net']").css("background-color","pink");//net으로 끝나는
            $("a[href*='homeplus']").css("background-color","pink");//중간에
        });
    </script>
</head>
<body>
    <h1>리스트</h1>
    <ul>
        <li><a href="http://naver.com">Naver</a></li>
        <li><a href="http://daum.net">Daum</a></li>
        <li><a href="http://google.com">Google</a></li>
        <li><a href="http://tistory.com" title="티스토리 홈페이지">Tistory</a></li>
        <li><a href="mailto://rudd~~@naver.com">mail</a></li>
        <li><a href="http://www.homeplus.co.kr">홈플러스</a></li>
    </ul>
</body>
</html>
cs

결과


저작자표시 비영리 변경금지

'* Programming > JQuery' 카테고리의 다른 글

ex05.html(선택자)  (0) 2016.10.06
ex04.html  (0) 2016.10.06
ex02.html  (0) 2016.10.06
ex01.html  (0) 2016.10.06
JQuery 시작  (0) 2016.10.06

+ Recent posts

티스토리툴바