Thymeleaf (text) / 자바스크립트에서 Thymeleaf 사용하기

* thymeleaf는 기본적으로 html 태그 속성의 기능을 정의해서 동작한다.

 

예를 들어보자.

<span>Apple<span>

→  은 Apple가 출력된다.

 

 

▶ 같은 코드에 아래와 같이  th:text="${data}" 을 추가해주면

<span th:text="${data}">Apple<span>

→  Apple 대신 ${data}의 값으로 치환되어 출력된다. (cf- ${data}의 값이 mango 면 mango가 출력될것이다.)

 

 

▶ 여기서 만약 나는 태그에 정의해서 출력하는 방법말고, <span></span> 태그 내용에 직접출력하고 싶다? → 그럴땐

<span>[[${data}]]<span>

이런식으로 작성해 주면 된다. (cf - 타임리프는 html이 깨지는 것을 방지하기 위해 escape를 기본적으로 지원한다.)

 

 

▶ escape 를 제외하고 출력을 원한다면  → 2가지 방법 예시

<span th:utext="${data}"></span>

· html 태그 속성의 기능을 정의

<span>[(${data})]<span>

· 태그 내용에 직접출력

 

 

◈ 여기서 escape 란? (참)

https://www.zerocho.com/category/HTML&DOM/post/587f50b1308ed50018a00d51#google_vignette

(HTML&DOM) HTML 엔티티(entity) - 이스케이프(escape), 이스케이핑(escaping)

https://giveme-happyending.tistory.com/33

[HTML] 이스케이프 문자