Attributes

Most html attributes can be assigned via th:<attr_name>="..." You can hardcore assign value as default value. When all ok, it will be rewritten.

<a href="will be rewritten" th:href="@{/my_cool_link.html}">my cool link</a>

<a th:href="${'/base_url/'+${obj.cool_link}}">my cool link</a>

<input type="submit"  th:value="#{input.submit}"/>

Universal way is using th:attr. Here you can assign one attribute or list of attributes at once.

<a th:attr="href=@{/my_cool_link.html}">my cool link</a>

<img th:attr="src=@{/images/logo.jpg},title=#{logo},alt=#{logo}" />

You can append or prepend some string to an existing attribute value using th:attrappend. There are also two specific appending attributes: the th:classappend and th:styleappend.

<!-- result will be
<input type="button" value="Do it!" class="btn warning" />
-->
<input type="button" value="Do it!" class="btn" th:attrappend="class=${' ' + cssStyle}" />

<tr th:each="prod : ${prods}" class="row" th:classappend="${prodStat.odd}? 'odd'">

You can define custom attributes with names like data-*

<button th:data-url="@{/myHomeUrl}"
    th:onclick="window.location.href=this.getAttribute('data-url')">

Thymeleaf allows embedding into a attribute value. For this use a |...|

<a th:href="|#my-anchor-${ind}|"> my cool link </a>

If value of attribute contains large text, you must use th:attr or custom attribute.

<!-- just for demonstration, 
using  th:onclick will crush thymeleaf parser
-->
<button type="button" name="btAddContent"
  th:attr="onclick=|var okCode = ${ok};
    var errCode = ${err};
    $.ajax({
     url: '/myapi/new_content',
     type: 'POST',
     contentType: 'application/json',
     dataType: 'json',
     data: JSON.stringify({ 
         path : $('#formShortArticleListPath').val() ,
         description : $('#formShortArticleListDescr').val()
      }),
      success: function(response) { eval(okCode);  } ,
      error: function (data) { eval(errCode);  }
      });|">