Thymeleaf 兩種異步刷新部分htlm頁面方法

經量使用id定位 

$(".header_gw").mouseenter(function () {
        $.get("cartListforAjax", function (data) {
            $("#cartListInner").html(data);
        });
    });

th:fragment

      在list.htlm頁面中  使用 th:fragment  標籤將需要動態刷新的部分包裹起來 

<div class="GM_banner_main" th:fragment="pageInfo">
    <a href="#" id="cur" th:text="${skuLsInfoAndDsl?.cur}">
</div>

 2.後端代碼

  返回 "list : : pageInfo" 表示    將數據渲染到  list頁面的   th:fragment  值爲pageInfo的部分

@GetMapping("page")
    public String listPage(@RequestParam("cur") int cur, @RequestParam("dsl")String dsl, ModelMap modelMap) {
        PmSearchSkuInfosAndDsl pmSearchSkuInfosAndDsl = searchService.page(cur,dsl);
        modelMap.put("skuLsInfoAndDsl",pmSearchSkuInfosAndDsl);
        return "list::pageInfo";
    }

3.使用ajax請求時,直接將渲染好的 html 頁面  $(".GM_banner_main").html(htmlText);  替換掉

     $.ajax({
                url:"page",
                type:"GET",
                data:{
                    dsl:str,
                    cur:cur-1,
                },
                success:function (htmlText) {
                $(".GM_banner_main").html(htmlText);
                }
            })

th:include="cartListInner"

   1.在 list.htlm 頁面中  使用 th:include="cartListInner"  標籤,裏面不用   cartListInner表示需要渲染的頁面名

​​​​​​​<div th:include="cartListInner" id="cartListInner">

</div>

  2. 在cartListInner.html 頁面中 渲染數據

<ul>
    <li  th:each="cartInfo:${cartList}">
       <img  th:src="${cartInfo.productPic}"/>
    </li>
</ul>

3.後端代碼

 return "cartListInner"  表示將數據渲染到 cartListInner.htlm這個頁面   然後在 list.htlm又包括了 

   cartListInner.htlm所以最終數據 渲染到  list.html 頁面

    @RequestMapping("checkCart")
    public String checkCart( String isChecked,String skuId,ModelMap modelMap){
        modelMap.put("cartList","");  放入一些數據
        return "cartListInner";
    }