模拟 ajax模拟调用json数据(内容页)

html:
<div class="head-nav">
    <a href="../index.html">集团首页</a> >
    <a href="news.html">新闻媒体</a> >
    <!-- 标题 -->
    <a href="javascript:;"></a>
</div>
<div class="head-title">
    <!-- 标题 -->
    <p class="head-title-name"></p>
    <p class="head-title-des"><span></span><span></span></p>
</div>
<div class="news-detail">
</div>
<script>
    var arr = location.href.slice(location.href.indexOf('?')+1).split(/[=&]/);
    var query = {};
    for(var i = 0; i< arr.length; i++) {
        query[arr[i]] = arr[++i];
    }
    // 新闻详情
    $.ajax({
        url: '../mock/xxzqDetail.json',
        success:function (data) {
            news(data.data.xxzq[query.news])
        }
    })
    // 新闻详情渲染
    function news (data) {
        // 标题
        $('.head-nav a').eq(2).text(data.title);
        $('.head-title-name').text(data.title);
        // 时间
        $('.head-title-des span').eq(0).text(data.time);
        $('.head-title-des span').eq(1).text('来源:' + data.from);
        $('.news-detail').html(data.detail)
    }
</script>

猜你喜欢

转载自blog.csdn.net/weixin_40292626/article/details/80111962