将该代码重复的部分用数组遍历的方式实现<div class="hot-sell"> <p class="house-title">热销推荐<a href="">更多优品 &gt;</a></p> <div class="layui-row layui-col-space20"> <table> <a href="detail.html" class="layui-col-xs3 text"> <div><img src="/BookShopSystem_war/static/img/home_img4.jpg"></div> <p>一盏好看的台灯</p> <p class="price">￥200</p> </a> <a href="detail.html" class="layui-col-xs3 text"> <div><img src="/BookShopSystem_war/static/img/home_img5.jpg"></div> <p>时尚瓷碗7件套</p> <p class="price">￥200</p> </a> <a href="detail.html" class="layui-col-xs3 text"> <div><img src="/BookShopSystem_war/static/img/home_img6.jpg"></div> <p>智能电吹风</p> <p class="price">￥200</p> </a> <a href="detail.html" class="layui-col-xs3 text"> <div><img src="/BookShopSystem_war/static/img/home_img7.jpg"></div> <p>一盏好看的台灯</p> <p class="price">￥200</p> </a> </table> </div> </div>

你可以将重复的部分用一个包含图片、商品名和价格的对象数组表示，然后用循环语句遍历数组，依次生成HTML代码。示例如下：

<div class="hot-sell">
    <p class="house-title">热销推荐<a href="">更多优品 &gt;</a></p>
    <div class="layui-row layui-col-space20">
        <table>
            <% var products = [
                { image: '/BookShopSystem_war/static/img/home_img4.jpg', name: '一盏好看的台灯', price: '￥200' },
                { image: '/BookShopSystem_war/static/img/home_img5.jpg', name: '时尚瓷碗7件套', price: '￥200' },
                { image: '/BookShopSystem_war/static/img/home_img6.jpg', name: '智能电吹风', price: '￥200' },
                { image: '/BookShopSystem_war/static/img/home_img7.jpg', name: '一盏好看的台灯', price: '￥200' }
            ]; %>
            <% for (var i = 0; i < products.length; i++) { %>
                <a href="detail.html" class="layui-col-xs3 text">
                    <div><img src="<%= products[i].image %>"></div>
                    <p><%= products[i].name %></p>
                    <p class="price"><%= products[i].price %></p>
                </a>
            <% } %>
        </table>
    </div>
</div>