상세 컨텐츠

본문 제목

JavaScript - jQuery 태그 속성 처리. attr()

개발/JavaScript

by 뉴에이스 2020. 8. 13. 17:46

본문

속성 처리하기

setAttribute(이름, 값)
getAttribute(이름)

attr(이름, 값) : 설정
attr(이름) : 추출

 

속성 설정하기 - HTML 소스

<button>설정하기</button>
<div id="a">a</div>
<div>b</div>
<div>c</div>

 

속성 설정하기 - 스크립트 소스

<script>
    $("button")[0].addEventListener("click", function () {
        $("div#a").attr({ "data-msg": "aaa", "data-count": "10", "data-name": "연습중..." });
    });
</script>

 

속성 설정하기 - 결과

 

속성 가져오기 - HTML 소스

<button>가져오기</button>
<div id="a" data-msg="b" data-count="10">연습중...</div>

 

속성 가져오기 - 스크립트 소스

<script>
    $("button")[0].addEventListener("click", function () {
        var $div = $("div");
        console.log($div.attr("id"));
        console.log($div.attr("data-msg"));
        console.log($div.attr("data-count"));
    });
</script>

 

속성 가져오기 - 결과

관련글 더보기

댓글 영역