<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
        <script>
            $(function(){
                $("#btn").on("click",function(){
                    $("#p"+$("#line_num").val()).css("background-color",$("#line_color").val());
                })
            })
        </script>
    </head>
    <body>
        <div class="wrapper">
            <div id="p1">P1</div><br>
            <div id="p2">P2</div><br>
            <div id="p3">P3</div><br>
            <div id="p4">P4</div><br>
            <div>
                <input type="text" placeholder="줄 번호를 입력하세요." id="line_num">
                <input type="text" placeholder="색을 입력하세요" id="line_color">
                <input type="button" value="적용" id="btn">
            </div>
        </div>
    </body>
</html>

'디지털 컨버전스 > Java Script' 카테고리의 다른 글

[JQuery] 동적 테이블  (0) 2020.04.20
[JQuery] 다이나믹 데이터  (0) 2020.04.20
[JQuery] 예제 - 비밀번호 일치  (0) 2020.04.17
[JQuery] 예제 - 메세지 이동  (0) 2020.04.17
[JQuery]  (0) 2020.04.17

+ Recent posts