JQuery

230217 JQuery 속성제어 attr()

주영재 2023. 2. 17. 14:01

제이쿼리 문서 객체 조작 attr()
value값을 제외한 다른 속성들을 제어할 수 있음.

-매개값을 한개 주면 특정 값 확인
-매개값을 두개 주면 특정 값 변경
-매개값을 객체 형식{키:값,키:값...}으로 주면 여러 값을 한번에 변경 가능

 

 

jquery02.html

<!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>
    <!-- jquery -->
    <script src="js/jquery-3.6.3.min.js"></script>
</head>
<body>
    <h3>속성제어</h3>
    
    <input type="text" class="test1" id="xx"/>
    <img src="#" class="test2"/>
    <img src="#" class="test3" width="" height=""/>

    <script>
        //var x = document.querySelector(".test1").id;
        var x=$(".test1").attr("id") //id속성을 얻음
        console.log(x);

        //src값을 변경
        $(".test2").attr("src","값을 변경");

        //여러속성을 한번에 변경
        $(".test3").attr({src:"변경",width:"200",height:"200"});


    </script>

</body>
</html>