728x90
@GetMapping("/attribute")
public String attribute(){
return "basic/attribute";
}<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>속성 설정</h1>
<input type="text" name="mock" th:name="userA" />
<h1>속성 추가</h1>
- th:attrappend = <input type="text" class="text" th:attrappend="class=' large'" /><br/>
- th:attrprepend = <input type="text" class="text" th:attrprepend="class='large '" /><br/>
- th:classappend = <input type="text" class="text" th:classappend=" large" /><br/>
<h1>checked 처리</h1>
- checked o <input type="checkbox" name="active" th:checked="true" /><br/>
- checked x <input type="checkbox" name="active" th:checked="false" /><br/>
- checked=false <input type="checkbox" name="active" checked="false" /><br/>
</body>
</html>- 속성 설정
- 타임리프는 주로 HTML 태그에 th:* 속성을 지정하는 방식으로 동작한다
- . th:* 로 속성을 적용하면 기존 속성을 대체한다.
- 기존 속성이 없으면 새로 만든다
- 속성 추가
- th:attrappend : 속성 값의 뒤에 값을 추가한다.
- th:attrprepend : 속성 값의 앞에 값을 추가한다.
- th:classappend : class 속성에 자연스럽게 추가한다( 띄어쓰기 같은 게 필요 X)
- checked 처리
- HTML에서는 checked 속성만 있을경우 check가 되어있는 단점이 있다(개발자의 경우 로직의 작성해 주어야 함)
- 타임리프의 th:checked는 값이 false인 경우 checked 속성 자체를 제거하여 준다
728x90
'스프링 MVC 2편(백엔드 웹 개발 활용 기술)' 카테고리의 다른 글
| Ch01. 타임리프(기본 기능) - 조건부 평가 (0) | 2022.03.10 |
|---|---|
| Ch01. 타임리프(기본 기능) - 반복 (0) | 2022.03.10 |
| Ch01. 타임리프(기본 기능) - 연산 (0) | 2022.03.09 |
| Ch01. 타임리프(기본 기능) - 리터럴 (0) | 2022.03.09 |
| Ch01. 타임리프(기본 기능) - URL 링크 (0) | 2022.03.09 |