www.baike369.com
百科369 > Ajax教程 > XMLHttpRequest(XHR)对象MIME类型的差异与有效性

XMLHttpRequest(XHR)对象MIME类型的差异与有效性


XMLHttpRequest(XHR)对象MIME类型的差异与有效性

为了要浏览所有MIME类型的差异、合适性和有效性,可以使用下面的例子。


实例

1. test.html文件的源代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>XMLHttpRequest(XHR)对象MIME类型的差异与有效性实例-www.baike369.com</title>
<script type="text/javascript"> 
function encodeValue(val)
{
  var encodedVal;
  if (!encodeURIComponent)
  {
    encodedVal = escape(val);
    /* fix the omissions */
    encodedVal = encodedVal.replace(/@/g, '%40');
    encodedVal = encodedVal.replace(/\//g, '%2F');
    encodedVal = encodedVal.replace(/\+/g, '%2B');
  }
  else
  {
    encodedVal = encodeURIComponent(val);
    /* fix the omissions */
    encodedVal = encodedVal.replace(/~/g, '%7E');
    encodedVal = encodedVal.replace(/!/g, '%21');
    encodedVal = encodedVal.replace(/\(/g, '%28');
    encodedVal = encodedVal.replace(/\)/g, '%29');
    encodedVal = encodedVal.replace(/'/g, '%27');
  }
  /* clean up the spaces and return */
  return encodedVal.replace(/\%20/g,'+'); 
}
function createXHR()
{
  try { return new XMLHttpRequest(); } catch(e) {}
  try { return new ActiveXObject("Msxml2.XMLHTTP.6.0"); } catch (e) {}
  try { return new ActiveXObject("Msxml2.XMLHTTP.3.0"); } catch (e) {}
  try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) {}
  try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) {}
  return null;
}
function sendRequest(form)
{
  xhr = createXHR();
  if (xhr)
  {
    var url = "http://www.baike369.com/code.php";
    var payload ="responsetype=" +  encodeValue(form.responseType.options[form.responseType.selectedIndex].text);
    payload += "&badxml=" + form.badxml.checked;
    xhr.open("GET",url + "?" + payload,true);
    xhr.onreadystatechange = function(){handleResponse();};
    xhr.send(null);
  }
}
function handleResponse()
{
  if (xhr.readyState == 4  && xhr.status == 200)
  {
    var xmlDoc = xhr.responseXML;
    var spot = document.getElementById('responseOutput');
    if (xmlDoc && xmlDoc.documentElement)
    {
      spot.innerHTML = "XML Document exists<br />";
    }
    else
    {
      spot.innerHTML = "XML Document does not exist<br />";
    }
    if (xmlDoc && xmlDoc.getElementsByTagName("payload")[0] && xmlDoc.getElementsByTagName("payload")[0].firstChild)
    { 
      var payload = xmlDoc.getElementsByTagName("payload")[0].firstChild.nodeValue;
      spot.innerHTML += "payload=" + payload + "<br />";
    }
    else
    {
      spot.innerHTML += "Can not access payload.<br />";
    }
    if (xmlDoc && xmlDoc.documentElement)
    {
      spot.innerHTML += "<br />Here is the XML Document: <br />";
      printxml(xmlDoc);
    }
  }
}
function printxml(node) 
{
  var spot = document.getElementById('responseOutput');
  var tagname = node.tagName;
  var val =  node.nodeValue;
  if (tagname)
  {
    spot.innerHTML += "&lt;" + tagname + "&gt;";
  }
  else if (val)
  {
    var converted = val.replace(/<([^>]*)>/g, "&lt;$1&gt;");
    converted = converted.replace(/\n/g, "<br/>");
    spot.innerHTML += converted;
  }
  node = node.firstChild;
  while (node) 
  {
    printxml(node);
    node = node.nextSibling;
  }
  if (tagname)
  {
    spot.innerHTML += "&lt;/" + tagname + "&gt;";
  }
}</script> 
</head>
<body>
<h3>Response XML Tester</h3>
<form>
  <label>Response MIME:
  <select name="responseType">
    <option>text/xml</option>
    <option>application/xml</option>
    <option>application/xhtml+xml</option>
    <option>text/html</option>
    <option>text/plain</option>
    <option>bad/mime</option>
  </select></label>
  <label>&nbsp;&nbsp;Return Bad XML? <input type="checkbox" name="badxml" /></label>
<input type="button" value="Send" onclick="sendRequest(this.form);" />
</form>
<br />
<div id="responseOutput">&nbsp;</div>
</body>
</html>

2. code.php文件的源代码如下:

<?php
header("Cache-Control: no-cache");
header("Pragma: no-cache");
$responseType = $_GET["responsetype"];
$badXML = $_GET["badxml"];
header("Content-Type: " . $responseType);
print "<?xml version='1.0' encoding='UTF-8'?>\n";
print "<packet>\n<headers>Some headers here</headers>\n<payload> Behold I am response payload! ";
if ($badXML == "false")print "</payload>\n";
print "</packet>\n";
?>

3. 显示效果如下:

XMLHttpRequest(XHR)对象MIME类型的差异与有效性实例

Copyright© 2011-2016 www.baike369.com All Rights Reserved