当前位置: 首页 > news >正文

PHP 实例 - AJAX 与 XML

AJAX 可用来与 XML 文件进行交互式通信。


AJAX XML 实例

下面的实例将演示网页如何通过 AJAX 从 XML 文件读取信息:

实例

 Select a CD: Bob Dylan /Bee Gees /Cat Stevens 

CD info will be listed here...


实例解释 - HTML 页面

当用户在上面的下拉列表中选择某张 CD 时,会执行名为 "showCD()" 的函数。该函数由 "onchange" 事件触发:

<html>
<head>
<script>
function showCD(str)
{
    if (str=="")
    {
        document.getElementById("txtHint").innerHTML="";
        return;
    } 
    if (window.XMLHttpRequest)
    {
        // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行
        xmlhttp=new XMLHttpRequest();
    }
    else
    {
        // IE6, IE5 浏览器执行
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","getcd.php?q="+str,true);
    xmlhttp.send();
}
</script>
</head>
<body>

<form>
Select a CD:
<select name="cds" onchange="showCD(this.value)">
<option value="">Select a CD:</option>
<option value="Bob Dylan">Bob Dylan</option>
<option value="Bonnie Tyler">Bonnie Tyler</option>
<option value="Dolly Parton">Dolly Parton</option>
</select>
</form>
<div id="txtHint"><b>CD info will be listed here...</b></div>

</body>
</html>

showCD() 函数会执行以下步骤:

  • 检查是否有 CD 被选择
  • 创建 XMLHttpRequest 对象
  • 创建在服务器响应就绪时执行的函数
  • 向服务器上的文件发送请求
  • 请注意添加到 URL 末端的参数(q)(包含下拉列表的内容)

PHP 文件

上面这段通过 JavaScript 调用的服务器页面是名为 "getcd.php" 的 PHP 文件。

PHP 脚本加载 XML 文档,"cd_catalog.xml",运行针对 XML 文件的查询,并以 HTML 返回结果:

<?php
$q=$_GET["q"];

$xmlDoc = new DOMDocument();
$xmlDoc->load("cd_catalog.xml");

$x=$xmlDoc->getElementsByTagName('ARTIST');

for ($i=0; $i<=$x->length-1; $i++)
{
    // 处理元素节点
    if ($x->item($i)->nodeType==1)
    {
        if ($x->item($i)->childNodes->item(0)->nodeValue == $q)
        {
            $y=($x->item($i)->parentNode);
        }
    }
}

$cd=($y->childNodes);

for ($i=0;$i<$cd->length;$i++)
{ 
    // 处理元素节点
    if ($cd->item($i)->nodeType==1)
    {
        echo("<b>" . $cd->item($i)->nodeName . ":</b> ");
        echo($cd->item($i)->childNodes->item(0)->nodeValue);
        echo("<br>");
    }
}
?>

当 CD 查询从 JavaScript 发送到 PHP 页面时,将发生:

  1. PHP 创建 XML DOM 对象
  2. 查找所有 <artist> 元素中与 JavaScript 所传数据相匹配的名字
  3. 输出 album 的信息,并发送回 "txtHint" 占位符

相关文章:

  • 期货开户每日无负债结算制度
  • Redis、JVM、并发、MySQL、Java、网络等一个你都“啃”不完,何谈BAT?
  • 详解 docker save 与 docker export 的区别
  • 【华为账号服务】【FAQ】Account Kit常见咨询合集--获取帐号个人信息相关问题
  • 每个人都可以用的开源微信机器人
  • 一幅长文细学华为MRS大数据开发(四)——HBase
  • Vue2、Vue3知识总结---完整版✨
  • ISME| 南农大沈其荣院士团队最新揭示根际微生物组成变化可更早预测番茄青枯病
  • java基于 ssm+jsp的线上授课作业管理系统
  • 一、Win10安装并检测GPU版本Pytorch
  • 远程调试 idea配置remote debug、在远程服务器的程序中,添加JVM启动参数-Xdebug
  • Google Earth Engine(GEE)——一个简单的时序动画UI
  • L74.linux命令每日一练 -- 第十章 Linux网络管理命令 -- nmap和tcpdump
  • 进入mysql命令行之后,怎么退出
  • Js获取url里面的参数
  • Google 是如何开发 Web 框架的
  • 002-读书笔记-JavaScript高级程序设计 在HTML中使用JavaScript
  • C++类中的特殊成员函数
  • CAP理论的例子讲解
  • Java 多线程编程之:notify 和 wait 用法
  • Java知识点总结(JDBC-连接步骤及CRUD)
  • linux安装openssl、swoole等扩展的具体步骤
  • ng6--错误信息小结(持续更新)
  • Node.js 新计划:使用 V8 snapshot 将启动速度提升 8 倍
  • node-sass 安装卡在 node scripts/install.js 解决办法
  • SOFAMosn配置模型
  • vue 个人积累(使用工具,组件)
  • vue 配置sass、scss全局变量
  • WordPress 获取当前文章下的所有附件/获取指定ID文章的附件(图片、文件、视频)...
  • 每天一个设计模式之命令模式
  • 时间复杂度与空间复杂度分析
  • 使用Maven插件构建SpringBoot项目,生成Docker镜像push到DockerHub上
  • 小程序滚动组件,左边导航栏与右边内容联动效果实现
  • gunicorn工作原理
  • Java性能优化之JVM GC(垃圾回收机制)
  • 扩展资源服务器解决oauth2 性能瓶颈
  • ​​​​​​​ubuntu16.04 fastreid训练过程
  • # 数论-逆元
  • # 学号 2017-2018-20172309 《程序设计与数据结构》实验三报告
  • #微信小程序:微信小程序常见的配置传旨
  • #我与Java虚拟机的故事#连载16:打开Java世界大门的钥匙
  • (Oracle)SQL优化技巧(一):分页查询
  • (Python) SOAP Web Service (HTTP POST)
  • (SpringBoot)第七章:SpringBoot日志文件
  • (TOJ2804)Even? Odd?
  • (汇总)os模块以及shutil模块对文件的操作
  • (免费领源码)python#django#mysql校园校园宿舍管理系统84831-计算机毕业设计项目选题推荐
  • (正则)提取页面里的img标签
  • (转)jdk与jre的区别
  • (转)我也是一只IT小小鸟
  • .a文件和.so文件
  • .net core 客户端缓存、服务器端响应缓存、服务器内存缓存
  • .NET 反射的使用
  • .NetCore Flurl.Http 升级到4.0后 https 无法建立SSL连接
  • .netcore 如何获取系统中所有session_ASP.NET Core如何解决分布式Session一致性问题