51. PHP 页面静态化(4)

全部纯静态化 — 局部纯静态化

---

实现步骤：

---

1. 编写接口

<?php

//排行榜接口数据
//1. 获取数据
//2. 把我们获取到的数据组装成接口数据提供通信

//连接数据库
require_once('./db.php');

$connect = Db::getInstance()->connect();

$sql = 'select * from hit as a join news as b on a.news_id=b.id order by a.count desc limit 3';

$result = mysql_query($sql,$connect);

while($row = mysql_fetch_assoc($result))
{
    $res[] = $row;
}

// 1 代表成功代码
return show(1,'success',$res);

//将数据生成接口数据

function show($code=0,$message='error',$data=array())
{
    $result = array(
        'code'=>$code,
        'message'=>$message,
        'data'=>$data,
    );
    echo json_encode($result);
}

插件名称：JSON-handle

---

2. 编写 ajax

在模板文件中引入 jquery

单独写一个 js 文件，然后引入。

js 文件：

$.ajax({
    url:'http://state.com/api/top.php',
    type:'get',
    dataType:'json',
    error:function(){

    },
    success:function(result){
        html = '';
        $.each(){result.data,function(key,value){
            html += '<li><a href="/">' + value.title + '</a></li>';
        }};

        //把数据填充到模板指定的id中
        $("#hot_html").html(html);
    },
});

ajax 优化： 对 code 进行判断

$.ajax({
    url:'http://state.com/api/top.php',
    type:'get',
    dataType:'json',
    error:function(){

    },
    success:function(result){
        if(result.code == 1){
            html = '';
            $.each(){result.data,function(key,value){
                html += '<li><a href="/">' + value.title + '</a></li>';
            }};

            //把数据填充到指定的id中
            $("#hot_html").html(html);
        }else{
            //看业务需求
        }

    },
});

这样在 index.shtml 中刷新，也可以发生 ajax 请求。