获取ajax数据动态添加html内容

panfei-

于 2016-12-03 01:17:51 发布

阅读量1.5k

点赞数 1

文章标签： ajax

本文链接：https://blog.youkuaiyun.com/qq604042454/article/details/53441054

版权

这篇博客介绍如何通过Ajax获取JSON数据，并利用JavaScript动态地将数据添加到HTML页面中。示例代码展示了$.ajax的使用以及$.each方法遍历JSON对象，将数据展示在页面上。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

假设一个json文件内容为

[{
    "id": 1,

    "content": [{

        "title": "散货卸船时严禁撒漏，作业线随撒随扫；"
    }, {

        "title": "皮带线作业，注意与中控保持联系，提高作业效率；"
    }, {

        "title": "玉米作业前冲洗好料斗中的矿粉残留，保证货运质量；"
    }, {

        "title": "关注在途船舶动态；"
    }, {

        "title": "控制车辆，严禁超载，提醒车队夜间行车注意慢行；"
    }, {

        "title": "设备停机，注意将机械锚定，并做好设备保养及卫生；"
    }]
}, {
    "id": 2,

    "content": [{

        "title": "船舶靠离泊提前到位，做好安全监护；"
    }, {

        "title": "机械进出舱及清舱作业人机配合好；"
    }, {

        "title": "水平运输及流动机械控制车速，按规定的线路行驶，互相避让，注意安全；"
    }, {

        "title": "皮带线加强巡视检查ÿ

最低0.47元/天解锁文章