본문 바로가기
javaScript/jQuery

[jQuery] 태그 내용 가져오기 html(), text() 차이

by mooyou 2023. 1. 29.
728x90
300x250
SMALL

 

태그 내용 가져오기

$대상.html()
$대상.text()

 

태그 내용을 가져오는 방법은 html() 메서드를 이용하거나 text()메서드를 이용할 수 있다.

html() : 태그 메서드 까지 가져올 경우

text() :  텍스트만 추출할 경우

 

 

html()

<script>
    $(document).ready(function() {
        $("#btnAdd").click(function() {
            console.log($(".list").html());
        })
    });
</script>


<button id="btnAdd">
    리스트 내용 가져오기
</button>
<ul class="list">
    <li>A</li>
    <li>B</li>
    <li>C</li>
    <li>D</li>
</ul>

 

실행결과

 

 text()

<script>
    $(document).ready(function() {
        $("#btnAdd").click(function() {
            console.log($(".list").text());
        })
    });
</script>


<button id="btnAdd">
    리스트 내용 가져오기
</button>
<ul class="list">
    <li>A</li>
    <li>B</li>
    <li>C</li>
    <li>D</li>
</ul>

 

실행결과

 

728x90
반응형
LIST

댓글