Javascript 尝试编写一个干净的购物车代码，该购物车支持将多个项目发送给多个收件人

我目前有一个shopfiy购物车，我正试图破解和改变布局

现在看起来是这样的

我希望它看起来像这样

下面是代码。我需要在代码中更改什么才能使它看起来像我想要的

<script type="text/javascript">
  function remove_item(id) {
  document.getElementById('updates_'+id).value = 0;
  document.getElementById('cart').submit();
 }

功能删除\u项（id）{
document.getElementById（'updates_'+id.）.value=0；
document.getElementById（'cart'）.submit（）；
}

。
{%if cart.item_count==0%}
您的购物车当前为空。
{%else%}
您的购物车（{Cart.item_count}}{{Cart.item_count}复数：'item'，'items'}}，{{Cart.total_price{124; money_with_currency}}total）
产品
接受者
量
成本
去除
{cart.items%中的项目为%s}
{{item.title}

{%include'装运地址'%}
计数：
{{item.line_price|money}
{%endfor%}
{{pages.shopping-cart.content}

订单总额：{{cart.Total_price | money_with_currency}



{%if额外的签出按钮%}
-或-

{{内容}用于{附加}签出}
{%endif%}
{%endif%}
其他你可能喜欢的产品

{collections.frontpage.products中产品的百分比限制：2%}

{{product.description | strip | html | truncatewords:15}

{product.variants%}{{variant.price{124; money_with_currency}-{{variant.title}{%endfor%}

{%if product.compare_at_price%}
{%if product.price_min！=product.compare_at_price%}
{{product.compare_at_price|money}-
{%endif%}
{%endif%}

{{product.price{u min}money}



{%endfor%}

为什么和我们一起购物？


24小时
我们总是在这里帮忙



没有垃圾邮件
我们永远不会分享你的信息



安全服务器
签出是256位加密的

我不确定这是否对您有帮助

加载页面时，您可以设置：

    $(document).ready(function(){
             if()//cart.item_count == 0 then
                    $('#display1').css('display','inline');
                    $('#display2').css('display','none');
             else
                    $('#display1').css('display','none');
                    $('#display2').css('display','inline');
    });

在该功能中，您可以根据“购物车项目计数”检查条件

您可以：

    <div id='general'>
        <div id='display1'>First Header</div>
        <div id='display2'>Second Header and Form</div>
    </div>

一第一标题
第二个标题和表格

你可以看到一个简单的例子

如果我错了，请纠正我

---

谢谢。

我不确定这对你是否有帮助

加载页面时，您可以设置：

    $(document).ready(function(){
             if()//cart.item_count == 0 then
                    $('#display1').css('display','inline');
                    $('#display2').css('display','none');
             else
                    $('#display1').css('display','none');
                    $('#display2').css('display','inline');
    });

在该功能中，您可以根据“购物车项目计数”检查条件

您可以：

    <div id='general'>
        <div id='display1'>First Header</div>
        <div id='display2'>Second Header and Form</div>
    </div>

一第一标题
第二个标题和表格

你可以看到一个简单的例子

如果我错了，请纠正我

多谢各位