Content관련 메소드 - text()

text() method

: 선택 된 요소의 content 영역을 리턴하거나 설정하는 메소드

getter로 사용 시 태그는 무시하고, setter로 사용 시 html 태그를 문자 자체로 인식한다.

 

html() method와 다른 점

html() -> 해당 요소를 태그까지 얻어오고 작성된 html태그를 실제 태그로 인식함

text() -> 해당 요소를 얻어올 때 태그는 무시하고 객체 값만 얻어오고 작성된 html 태그를 실제 태그로 인식하지 않음(문자 자체로 인식)

 

ex.

<h1 id="test3"><a>구글로 이동</a></h1>
<h1 id="test4"></h1>

h1 태그 안에 a태그를 넣어 봄

 

 <script>
        $(document).ready(function(){
            // getter
            var tmp = $("#test3").text();
            console.log("text() 리턴 값 : " + tmp);
            // -> result : 구글로 이동 <a>태그는 보이지 않음

            // setter
            $("#test4").text("<a>구글로 이동</a>");
            // <a>태그로 인식되는 것이 아니라 문자열 그 자체로 인식해버림
        });
    </script>

 

웹사이트로 켜서 콘솔창 확인했을 때 <a>구글로 이동</a> 이 아니라 "구글로 이동"만 출력

html()은 <a></a>까지 getter해오고 실제 태그로도 인식 되기 때문에 setter했을 때도 a태그가 생김

 

 

결과

<a></a>를 문자 그 자체로 인식