관리 메뉴

moozi

jQuery01.html 본문

TIS_2017/응용sw_1기

jQuery01.html

moozi 2017. 1. 19. 09:42

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>jQuery</title>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
    <script>
        $(document).ready(function(){
            $("h1").css("color","red");
            $("#title1").css("color","green");
            $(".box1").css("color","blue");
           
            var array=[
                    {
                        name:'네이버', link:'http://www.naver.com'
                    },
                    {
                        name:'구글',link:'http://www.google.co.kr'
                    },
                    {
                        name:'다음',link:'http://www.daum.net'
                    }
             ];
           
            var output="";
           
            $.each(array,function(index,item){
               
                output+="<a href='"+item.link+"'>"+item.name+"</a><br>"
            });
            $("#box2").html(output);
//            document.getElementById("box2").innerHTML=output;
          
        });
    </script>
</head>
<body>
    <h1>jQuery</h1>
    <h1 id="title1">jQuery</h1>
    <div class="box1">
        <h3>jQuery</h3>
    </div>
    <div id="box2"></div>
</body>
</html>

'TIS_2017 > 응용sw_1기' 카테고리의 다른 글

jQuery연습문제01  (0) 2017.01.19
gallery01.html  (0) 2017.01.19
javascript연습문제03  (0) 2017.01.18
javascript연습문제02  (0) 2017.01.17
javascript연습문제01  (0) 2017.01.16
Comments