淘宝购物车web页面模仿

采用HTML+CSS+原生JS手写，未使用组件开发。

效果图如下：

 初始页面效果

目前可以实现动态添加商品，通过随机函数生成随机数，从已有的数据中选择商品数据添加到页面，生成的商品可以从列表中删除；

随机添加商品 

删除商品 

window.onload = function() {
    //商品信息，可以使用ajax请求后台数据
    let data = [
        {
            shopName:"古风衣装",
            imgUrl:"./img/items1.jpg",
            itemTxt:"扇子男生霸气中国风古装复古大号折叠扇随身汉服配饰古风折扇",
            type:"颜色分类",
            typeChoice:"10存且试天下+流苏10存且试天下+流苏10存且试天下+流苏",
            priceOld:"49.00",
            priceNew:"25.60"
        },
        {
            shopName:"旁氏旗舰店",
            imgUrl:"./img/items2.jpg",
            itemTxt:"旁氏氨基酸系洗面奶米粹竹炭樱粉洁面乳深层清洁毛孔洁面乳正品女",
            type:"颜色分类",
            typeChoice:"米粹洁面150g*2",
            priceOld:"73.20",
            priceNew:"64.90"
        },
        {
            shopName:"海澜之家",
            imgUrl:"./img/items3.jpg",
            itemTxt:"高级感巴洛克衬衫男设计感小众情侣冰丝长袖衬衣夏季薄款外套潮牌",
            type:"颜色分类",
            typeChoice:"白色长袖2XL",
            priceOld:"90.00",
            priceNew:"68.87"
        },
        {
            shopName:"阿里大药房",
            imgUrl:"./img/items4.jpg",
            itemTxt:"明康欣阿达帕林凝胶祛痘膏30g*1支/盒正品痤疮正品保证丘疹粉刺",
            type:"套餐类型",
            typeChoice:"标准装",
            priceOld:"53.20",