Thymeleaf

Question

百里香叶片段：

<div th:fragment="assets">
    <script src="myscript"></script>
    <script src="myscript2"></script>
</div>

这段代码插入片段：

<div th:replace="fragments/assets :: assets"></div>

如何在没有包装器的情况下只包含内容？

<script src="myscript"></script>
<script src="myscript2"></script>

Answer 1

我发现处理脚本标签大小写的最佳方法是使用 Thymeleaf Layouts，因为在使用 th:include 或 th:replace 时片段总是嵌套在标签内。

此外，我使用的一种有用方法是在布局模板底部正常添加常用脚本，然后添加最终脚本内容块，例如：

  ...
  <script type="text/javascript" src="/resources/js/jquery-1.11.1.min.js"></script>
  <script type="text/javascript" src="/resources/js/bootstrap.min.js"></script>

  <div layout:fragment="script"></div>
</body>
</html>

然后使用该模板的页面可以在 "script" 块中指定任何额外的 javascript:

<script th:inline="javascript" layout:fragment="script" type="text/javascript">
/*<![CDATA[*/
  // Some javascript...
/*]]>*/

Answer 2

试试下面的方法

<div th:fragment="assets" th:remove="tag">
    <script src="myscript"></script>
    <script src="myscript2"></script>
</div>

Answer 3

您可以使用 th:block 仅包含块的内容。

像-

这样定义你的片段

<th:block th:fragment="assets">
    <script src="myscript"></script>
    <script src="myscript2"></script>
</th:block>

并像这样包含 -

<th:block th:include="fragments/assets :: assets"></th:block>

希望这对您有所帮助:)

Answer 4

Yout Thymeleaf 片段：

<div th:fragment="assets" th:remove="tag">
    <script src="myscript"></script>
    <script src="myscript2"></script>
</div>

您的片段代码插入：

<div th:replace="fragments/assets :: assets"></div>

这应该呈现如下：

<script src="myscript"></script>
<script src="myscript2"></script>

Answer 5

使用这个：

<div id="testId" th:include="fragments/assets :: assets"></div>

它还会插入指定的片段作为其 with in 外标签的主体，但不包括片段标签。

Answer 6

如果你喜欢将一些参数传递给脚本，你可以喜欢这个（Google reCaptchaV3 示例）：

在您的 HTML 中，执行此操作：

<th:block th:include="fragments/script-google-recaptcha-submit.html :: on-submit(form = 'contact-form')"></th:block>

在您的 'script-HTML' 中，执行此操作：

<th:block th:fragment="on-submit">
    <script th:inline="javascript">
        /*<![CDATA[*/

        function onSubmit(token) {
            console.log(/*[[${form}]]*/);
            document.getElementById(/*[[${form}]]*/).submit();
        }

        /*]]>*/
    </script>
</th:block>

Thymeleaf - 包含片段的内容

Thymeleaf - Include content of fragment

java

layout

templates