Notice
Recent Posts
Recent Comments
Link
«   2025/04   »
일 월 화 수 목 금 토
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30
Tags
more
Archives
Today
Total
관리 메뉴

개발이야기

[jQuery] html(), text() 메서드 차이 본문

Javascript

[jQuery] html(), text() 메서드 차이

re2592 2020. 5. 1. 14:40 
<!DOCTYPE html>
<html>
<head>
    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
    <script>
    $(document).ready(function(){
        var $val = $("#a");
        $val.html("<a>aa</a>");

        var $val2 = $("#b");
        $val2.text("<a>bb</a>")
    });
    </script>
</head>
<body>
	<div>
        <p id="a">this is first</p>
        <p id="b">this is second</p>
    </div>
</body>
</html>

 

실행 시 출력되는 화면은 다음과 같다.

 

aa

<a>bb</a>

 

즉 html은 태그 내용까지 변경이 가능하고, text는 태그가 아닌 단순 문자열만 변경이 가능하다.

실행 후, $val.html()과 $val.text()를 각각 실행해보면

 

$val.html(); // <a>aa</aa> 출력

$val.text(); //  aa 출력

 

라는 결과가 나온다.

저작자표시

'Javascript' 카테고리의 다른 글

서버 템플릿 엔진과 클라이언트 템플릿 엔진의 차이  (0) 2025.03.17
[jQuery] select 태그의 option에서 data 속성 값 불러오기  (0) 2022.11.22
자바스크립트 DOM 객체 vs 제이쿼리 객체  (0) 2020.05.01
[jQuery] find()와 filter()의 차이  (0) 2020.04.20
[jQuery] 제이쿼리 노드에서 자바스크립트 DOM 객체 접근  (0) 2020.04.20
'Javascript' Related Articles more
Comments