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" 占位符

参考：https://www.cgewang.com/category-15.html

PHP 实例 - AJAX 与 XML-AJAX XML 实例的更多相关文章

  1. 原生AJAX入门讲解（含实例）

    相对于jQuery.YUI以及其他一些类库的AJAX封装,原生JS的AJAX显得那么的尴尬,兼容性不好,要记很多的方法属性,调用不便捷,代码臃肿...但我还是想说,原生JS才是最根本最底层的知识(虽然 ...

  2. web 开发之js---ajax 中的两种提交方式ajax post 和 ajax get 实例

    ()post http://04101334.iteye.com/blog/637695/ ()get function serializeElement(element) { var method ...

  3. Sping MVC不使用任何注解处理（jQuery）Ajax请求（基于XML配置）

    1. Spring Spring框架是一个轻量级的解决方案,是一个潜在的一站式商店,用于构建企业就绪的应用程序.Spring框架是一个Java平台,为开发Java应用程序提供全面的基础架构支持.Spr ...

  4. Ajax--PHP+JQuery+Ajax解析json、XML数据、加载页面

    一.JQuery+Ajax用get.post方式提交和请求数据 知识要点: $('#userName').blur(function () { var txt = $(this).val(); $.a ...

  5. PHP 实例 - AJAX 实时搜索-AJAX Live Search

    PHP 实例 - AJAX 实时搜索 AJAX 可为用户提供更友好.交互性更强的搜索体验. AJAX Live Search 在下面的实例中,我们将演示一个实时的搜索,在您键入数据的同时即可得到搜索结 ...

  6. 自己动手之使用反射和泛型，动态读取XML创建类实例并赋值

    前言: 最近小匹夫参与的游戏项目到了需要读取数据的阶段了,那么觉得自己业余时间也该实践下数据相关的内容.那么从哪入手呢?因为用的是Unity3d的游戏引擎,思来想去就选择了C#读取XML文件这个小功能 ...

  7. 11月15日下午 ajax返回数据类型为XML数据的处理

    ajax返回数据类型为XML数据的处理 /*XML:可扩展标记语言 HTML:超文本标记语言 标签:<标签名></标签名> 特点: 1.必须要有一个根 2.标签名自定义 3.对 ...

  8. jquery ajax 访问webServer的xml文件

    最近项目中要使用到通过ajax访问webServer的xml文件,通过下面的方式可以直接访问webServer的xml文件,不需要在web.xml中进行任何配置.它的返回参数就是服务器上的xml文件. ...

  9. JavaScript调用后台的三种方法实例(包含两种Ajax)

    方法一:直接使用<%=%>调用(ASPX页面) 前台JS,代码如下: <script type="text/javascript"> var methodS ...

  10. XML&AJAX

    AJAX: Asynchronous Javascript and XML 1. 客户端触发异步操作 2. 创建新的XMLHttpRequest, 是重要的js对象,通过它提起对服务器端的请求 3. ...

随机推荐

  1. redis.cluster/memcached.cluster/wmware esxi

    1. 安装配置redis的cluster 集群 redis 集群高可用 实验环境 192.168.198.131 openvpn-server #42-Ubuntu SMP Mon Jun 8 14: ...

  2. C++中vector和堆的常用使用方法&例题：数据流中的中位数

    vector常用函数: (1)a.size();//返回a中元素的个数: (2)a.push_back(5);//在a的最后一个向量后插入一个元素,其值为5 (3)a[i]; //返回a的第i个元素, ...

  3. tbody滚动条占位导致与thead表头错位

    tbody出滚动条导致表头错位,上网上搜了一下,发现全是答非所问,能隐藏滚动条,还用问??我当前作出的效果是当tbody内容在正常情况下显示时,不显示滚动条,当内容区域高度超过外部容器时,滚动条自动显 ...

  4. lombok使用指南，代码极简工具

    我们的项目中会用到各种bean,比如vo,bo,dto等等,bean上的属性我们一般写get(),set()方法,整个java文件看起来很臃肿. 一.简介 我们今天介绍的lombok只用使用注解就可以 ...

  5. appium-1-安装

    1.appium安装 网盘地址,下载之后,一路点就可以了 链接:https://pan.baidu.com/s/1-X_ceUWisbuyosjztakKZw  密码:hxeu 系统变量中新增APPI ...

  6. pytest框架使用教程

    Pytest框架 一.简介 pytest:基于unittest之上的单元测试框架 有什么特点? 自动发现测试模块和测试方法 断言更加方便,assert + 表达式,例如 assert 1 == 1 灵 ...

  7. requests接口自动化1-json序列化与反序列化

    json序列化与反序列化: 序列化:将对象转换为json字符串 反序列化:将json字符串转换为对象,比如转换为python里的字典 import json #定义字典 dict1={'usernam ...

  8. java 数据结构（十）：Collection子接口：Set接口

    1. 存储的数据特点:无序的.不可重复的元素具体的: 以HashSet为例说明:1. 无序性:不等于随机性.存储的数据在底层数组中并非照数组索引的顺序添加,而是根据数据的哈希值决定的.2. 不可重复性 ...

  9. JavaScript动画实例：动感小球

    已知圆的坐标方程为: X=R*SIN(θ) Y=R*COS(θ)     (0≤θ≤2π) 将0~2π区间等分48段,即设定间隔dig的值为π/24.θ初始值从0开始,按曲线方程求得坐标值(x,y), ...

  10. CSS3 文字边框 -webkit-text-stroke 镂空的字体

    CSS边框的一个不足就是只有矩形的元素才能使用. -webkit-text-stroke可以为文字添加边框.它不但可以设置文字边框的宽度,也能设置其颜色. 而且,配合使用color: transpar ...