虚位以待(AD)
虚位以待(AD)
首页 > 网络编程 > PHP编程 > PHP+ajax实现获取新闻数据简单示例

PHP+ajax实现获取新闻数据简单示例
类别:PHP编程   作者:码皇   来源:互联网   点击:

这篇文章主要介绍了PHP+ajax实现获取新闻数据,涉及php ajax交互获取信息及json格式处理的相关操作技巧,需要的朋友可以参考下

本文实例讲述了PHP+ajax实现获取新闻数据的方法。分享给大家供大家参考,具体如下:

Get方式获取到的信息是字符串(responseText)

① 可以借助JSON对象的方法stringify()parse()方法,进行字符串和对象之间的转换

    var arr=[1,2,3];
    var a={
    left:100}
    ;
    //alert(JSON.stringify(a));
    //typeof JSON.stringify(arr)是string//JSON对象的输出有严格格式:'{
    "left":100}
    ',变量值要加双引号var s1="[1,2,3]";
    var s2="{
    left:100}
    ";
    var s3='{
    "left":100}
    ';
    //alert(JSON.parse(s1));
    //---输出数组[1,2,3]//alert(JSON.parse(s2));
    //---出错。因为JSON对象格式严格,必须是:'{
    "left":100}
    '的格式alert(JSON.parse(s3).left);
    //---输出Object Object

②ajax获取服务器内容的实例:

getNews.php代码:

    <?phpheader('content-type:text/html;
    charset="utf-8"');
    error_reporting(0);
    $news=array( array("title"=>'习近平同代表委员共商国是两会细节 国平',"date"=>"2016-3-16"), array("title"=>'李克强答如何解决"工资8000元到手仅5000元"',"date"=>"2016-3-16"), array("title"=>'两会闭幕辽宁"老虎"落马曾3年3连跳升副部级',"date"=>"2016-3-16"), array("title"=>'宁波市长卢子跃严重违纪被查 被指行贿斯鑫良',"date"=>"2016-3-16"), array("title"=>'美女翻译六上总理记者会 外号樱桃小丸子',"date"=>"2016-3-16"), array("title"=>'外媒:印尼警方击毙两名中国籍极端分子',"date"=>"2016-3-16"), array("title"=>'复旦将抗肿瘤药物专利6500万美元售美国公司',"date"=>"2016-3-16"), );
    echo json_encode($news);

文件getNews.php在浏览器中显示为:

复制代码 代码如下:
[{"title":"u4e60u8fd1u5e73u540cu4ee3u8868u59d4u5458u5171u5546u56fdu662fu4e24u4f1au7ec6u8282 u56fdu5e73","date":"2016-3-16"},<span style="font-family: Arial, Helvetica, sans-serif;">{"title":"u674eu514bu5f3au7b54u5982u4f55u89e3u51b3"u5de5u8d448000u5143u5230u624bu4ec55000u5143"","date":"2016-3-16"},</span><span style="font-family: Arial, Helvetica, sans-serif;">{"title":"u4e24u4f1au95edu5e55u8fbdu5b81"u8001u864e"u843du9a6cu66fe3u5e743u8fdeu8df3u5347u526fu90e8u7ea7","date":"2016-3-16"},{"title":"u5b81u6ce2u5e02u957fu5362u5b50u8dc3u4e25u91cdu8fddu7eaau88abu67e5u88abu6307u884cu8d3fu65afu946bu826f","date":"2016-3-16"},{"title":"u7f8eu5973u7ffbu8bd1u516du4e0au603bu7406u8bb0u8005u4f1au5916u53f7u6a31u6843u5c0fu4e38u5b50","date":"2016-3-16"},{"title":"u5916u5a92:u5370u5c3cu8b66u65b9u51fbu6bd9u4e24u540du4e2du56fdu7c4du6781u7aefu5206u5b50","date":"2016-3-16"},{"title":"u590du65e6u5c06u6297u80bfu7624u836fu7269u4e13u52296500u4e07u7f8eu5143u552eu7f8eu56fdu516cu53f8","date":"2016-3-16"}]

返回一个数组,数组元素为7个JSON对象,每个对象有两个属性:title和date

前端需要做的是,得到这些数据,并把它们通过DOM操作放在网页的相应位置上。

Ajax:通过某个接口(文件)去服务器取数据,把取回来的数据,根据数据特性,放在客户端网页上处理。

    <body> <input id="btn" type="button" value="按钮"/> <ul id="ul1">获取新闻到该处</ul> <script src="JSON.js"></script> <script src="ajax.js"></script></body>
    xhr.open("get","getNews.php",true);
    xhr.setRequestHeader("content-type","application/x-www-form-urlencoded");
    xhr.send();
    xhr.onreadystatechange=function(){
    if(xhr.readyState==4){
    if(xhr.status==200){
    var data=JSON.parse(xhr.responseText);
    varoUl=document.getElementById("ul1");
    var html='';
    //DOM操作,把服务器取回的内容显示在网页上。 for(var i=0;
    i<data.length;
    i++) {
    html+='<li> <a herf="">'+ data[i].title + '</a> [<span>' + data[i].date + '</span>]</li>';
    }
    oUl.innerHTML=html;
    }
    else{
    alert("出错了,Err: " + xhr.status);
    }
    }
    }

取回数据的页面:

③ajax函数简单封装

    functionajax(method,url,data,fn){
    try{
    xhr=new XMLHttpRequest();
    }
    catch(e){
    xhr=newActiveXObject("Microsoft.XMLHTTP");
    }
    if(method == "get" &&data){
    url+='?'+data;
    }
    xhr.open(method,url,true);
    if(method=="get"){
    xhr.send();
    }
    else{
    xhr.setRequestHeader("content-type","application/x-www-form-urlencoded") xhr.send(data);
    }
    xhr.onreadystatechange=function(){
    if(xhr.readyState==4){
    if(xhr.status==200){
    fn(xhr.responseText);
    }
    else{
    alert("出错了,Err: " + xhr.status);
    }
    }
    }
    }

④ajax轮询方式获取服务器资源

    setInterval(function(){
    ajax('get','getNews.php','',function(data){
    var data=JSON.parse(data);
    //参数回调 var oUl=document.getElementById("ul1");
    var html='';
    for (var i=0;
    i<data.length;
    i++){
    html+='<li> <aherf="">' + data[i].title + '</a> [<span>' +data[i].date + '</span>] </li>';
    }
    oUl.innerHTML=html;
    }
    );
    }
    ,1000);
    //ajax轮询方式,1秒钟自动更新一次页面。 //ajax真正的轮询不会1s钟一次那么快,这样太耗资源。

更多关于PHP相关内容感兴趣的读者可查看本站专题:《PHP+ajax技巧与应用小结》、《PHP网络编程技巧总结》、《PHP基本语法入门教程》、《php面向对象程序设计入门教程》、《php字符串(string)用法总结》、《php+mysql数据库操作入门教程》及《php常见数据库操作技巧汇总

希望本文所述对大家PHP程序设计有所帮助。

您可能感兴趣的文章:

  • PHP自定义函数判断是否为Get、Post及Ajax提交的方法
  • php采用ajax数据提交post与post常见方法总结
  • php AJAX POST的使用实例代码
  • 原生JS实现Ajax通过GET方式与PHP进行交互操作示例
  • PHP+Ajax实现的博客文章添加类别功能示例
  • PHP+ajax 无刷新删除数据
  • ajax php 实现写入数据库
  • 原生JS实现Ajax通过POST方式与PHP进行交互的方法示例
相关热词搜索: PHP ajax 获取 新闻数据