thymeleaf的th：if⽤原⽣html+javascript实现
完善版
整体思路是⽤javascript读取到值，然后根据值来判断，如果为真则删除掉⼀个div，如果为假就删除掉另⼀个div这样实现if。
⼀开始的thymeleaf页⾯
<div class="fr">
<block unless="${wBeeMallUser==null}">
<div class="user">
<ul class="selector">
<li>
<a href="@{/personal}">
个⼈中⼼
</a>
</li>
<li>
<a href="@{/orders}">
我的订单
</a>
</li>
<li>
<a href="@{/logout}">
退出登录
</a>
</li>
</ul>
<a href="##"class="username">
<block text="${wBeeMallUser.nickName}"></block>
<i class="iconfont icon-down"></i>
</a>
</div>
<div class="shopcart">
<a href="@{/shop-cart}"><i class="iconfont icon-cart"></i>
购物车(
<block text="${wBeeMallUser.shopCartItemCount}"></block>
)
</a>
</div>
</block>
<block if="${wBeeMallUser==null}">
<ul class="login">
<li><a href="@{/login}">登录</a></li>
<li><a href="@{/register}">注册</a></li>
</ul>
<div class="shopcart">
<a href="@{/login}"><i class="iconfont icon-cart"></i>
购物车(0)</a>
</div>
</block>
</div>
转换之后
由于javascript是不能取出session⾥的值的，所以需要在上⾯先弄⼀个隐藏起来的p标签来让它取到session⾥的值，然后再在js代码⾥⾯取出p标签的值。
<p hidden="hidden"id="nickname">{$user.nick_name}</p>
html
<div id="z"class="fr">
<div id="yes"class="fr">
<div class="user">
<ul class="selector">
<li>
<a href="personal">
个⼈中⼼
</a>
</li>
<li>
<a href="my_orders">
我的订单
</a>
</li>
<li>
<a href="/index.php/admin/mall/loginout">
退出登录
</a>
</li>
</ul>
<p >
{$user.nick_name}
</p>
thyme<i class="iconfont icon-down"></i>
</div>
<div class="shopcart">
<a href="cart"><i class="iconfont icon-cart"></i>
购物车( )
</a>
</div>
</div>
<div id="no"class="fr">
<ul class="login">
<li><a href="login">登录</a></li>
<li><a href="register">注册</a></li>
</ul>
<div class="shopcart">
<a href="login"><i class="iconfont icon-cart"></i>
购物车(0)</a>
</div>
</div>
<p hidden="hidden"id="nickname">{$user.nick_name}</p> </div>
javascript
<script>
var idn = ElementById("no");
var idy = ElementById("yes");
var value = ElementById("nickname").innerHTML;
if(value){
//就如果有这个⽤户名的话，应该把no删除
}
else{
//就如果没有这个⽤户名的话，应该把yes删除
}
}
</script>
这样就可以实现，但是有时候会卡，需要刷新⼀下。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。