# 13.5 自然JavaScript和CSS模版

就像在之前的章节看到的那样，JavaScript和CSS内联能够在JavaScript/CSS注释里包含内联表达式，就像：

```javascript
...
var username = /*[[${session.user.name}]]*/ "Sebastian Lychee";
...
```

这是有效的JavaScript。一旦执行，就会是：

```javascript
...
var username = "John Apricot";
...
```

在注释里封闭内联表达式的相同技巧实际上可以用于整个文本模式语法：

```javascript
  /*[# th:if="${user.admin}"]*/
     alert('Welcome admin');
  /*[/]*/
```

当静态地打开模板时，代码里的alert将会被展示。因为它是100%有效的JavaScript。当模板运行时，如果用户是admin，代码里的alert也会被展示。它等价于：

```javascript
  [# th:if="${user.admin}"]
     alert('Welcome admin');
  [/]
```

这实际上是初始版本在模板解析时转成的代码。

注意：尽管在注释里包装的元素就像内联的输出表达式一样，没有结束所在行（一直到右边的`;`才算结束）。但是，这种行为只是为内联的输出表达式保留的。

Thymeleaf 3.0允许开发`自然模板形式的复杂JavaScript脚本和CSS样式表`。它们同时对原型和工作的模板有效。
