数据替换

先创建json格式文件，将需要的内容创建好，然后用js的ajax请求本文件

// 创建用于执行 ajax 的 get 请求函数
function http_get(url,callback){
    let xml=new XMLHttpRequest()
    xml.open('get',url)
    xml.onreadystatechange=function(){
        if(xml.readyState==4 && xml.status==200){
            var data=JSON.parse(xml.responseText)
            callback && callback(data)
        }
    }
    xml.send()
}

let nearby = document.querySelector('.nearby') //获取到父元素
http_get('/No.2/api/homelist.json', function(data) {  //请求json地址和数据
    // console.log(data.data.poilist)
    var list = data.data.poilist.splice(0, 10)  //截取替换
    list.forEach(function(item) {
        let tmp = `    //创建标签
        <div class="takeaway">
            <div class="takeaway-1">
                <img src="${item.pic_url}" alt="">  //替换图片地址
            </div>
            <div class="takeaway-2">
                <p>${item.name}</p> //替换商家名
                <p><span>月售${item.month_sale_num}</span>	//替换销售量		   <span>${item.mt_delivery_time}|${item.distance}</span></p>  //替换时间和距离
                <p>${item.min_price_tip}</p> //替换起送价格
                <p>本店支持开发票，开票金额0元起</p>
            </div>
        </div>
        `
        nearby.insertAdjacentHTML('beforeend', tmp)  //依次添加到获取的父元素中后面
    })
})