Thymeleaf th:classappend属性追加 th:styleappend样式追加 th:data-自定义属性
生活随笔
收集整理的這篇文章主要介紹了
Thymeleaf th:classappend属性追加 th:styleappend样式追加 th:data-自定义属性
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
目錄
- 一. `th:classappend`
- 二. `th:styleappend`
- 三. `自定義屬性`
- 四. `data-th-屬性名的寫法`
?后臺數(shù)據(jù)準(zhǔn)備
public ZTestEntity init3() {ZTestEntity zTestEntity = new ZTestEntity();zTestEntity.setIsAdmin(true);zTestEntity.setName("賈飛天");return zTestEntity; } // ------------------------------------------------@GetMapping("/init3") public ModelAndView init3() {ModelAndView modelAndView = new ModelAndView();ZTestEntity entity = service.init3();modelAndView.addObject("entity", entity);modelAndView.setViewName("test3");return modelAndView; }?前臺
<!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <head><style>.content {color: red;}.preAttr {margin-top: 10px;}.test3 {border: 1px solid yellow;}</style><title>test3頁面的標(biāo)題</title> </head> <body><div id="container" th:object="${entity}"><!--// 省略......--></div> </body> </html>一. th:classappend
<!--?當(dāng)isAdmin為true時,追加test3屬性;否則不執(zhí)行任何操作 --> <div class="content" th:classappend="*{isAdmin} ? test3 : _">th:classappend測試內(nèi)容</div>渲染后
二. th:styleappend
<!--?當(dāng)isAdmin為true時,追加 margin-top:50px 的樣式;否則什么都不做 --> <div style="color: pink;" th:styleappend="*{isAdmin} ? 'margin-top:50px' : _">th:styleappend測試內(nèi)容</div>渲染后
三. 自定義屬性
<!--?data- 自定義屬性可以直接通過 th: 的形式來追加 --> <div th:data-custom-name="*{name}">th:data-屬性測試內(nèi)容</div><!--?th:任意屬性名 的方式,可以添加任意屬性 --> <div th:haha="*{name}">th:任意屬性測試內(nèi)容</div> <hr>渲染后
四. data-th-屬性名的寫法
<!--?data-th-屬性名 和 th:屬性名作用相同,只不過是寫法不同 --> <div data-th-class="*{name}">data-th-測試內(nèi)容</div> <div th:class="*{name}">th:class測試內(nèi)容</div>渲染后
總結(jié)
以上是生活随笔為你收集整理的Thymeleaf th:classappend属性追加 th:styleappend样式追加 th:data-自定义属性的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 怎么用手机在PDF上绘图？这个方法分享
- 下一篇： 什么是互联网