0

books.xml:

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
  <datas>
    <book>
      <id>
        1
      </id>
      <title>
        PHP Enterprise
      </title>
      <author>
        Wiwit
      </author>   
    </book>
    <book>
      <id>
        2
      </id>
      <title>
        PHP Undercover
      </title>
      <author>
        Wiwit
      </author>       
    </book>
  </datas>

test.php:

<!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=utf-8" />
<title>Ajax Client</title>
<script type="text/javascript">

var xmlHttp = createXmlHttpRequestObject();
// creates XMLHttpRequest Instance
function createXmlHttpRequestObject(){

  // will store XMLHttpRequest object
  // at here
  var xmlHttp;

  // works all exceprt IE6 and older  
  try
  {

    // try to create XMLHttpRequest object
    xmlHttp = new XMLHttpRequest();    
  }
  catch(e)
  {
    // assume IE 6 or older
    try
    {
      xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    catch(e){ }
  }

  // return object or display error
  if (!xmlHttp)
    alert("Error creating the XMLHttpRequest Object");
  else
    return xmlHttp;
}

function process()
{
  if(xmlHttp)
  {
    try
    {
      xmlHttp.open("Get","books.xml", true);
      xmlHttp.onreadystatechange = handleRequestStateChange;
      xmlHttp.send(null);
    }
    catch(e)
    {
      alert("Can't connect to server\n" + e.toString());
    }
  }
}

function handleRequestStateChange()
{
  myDiv = document.getElementById("myDivElement");

  if(xmlHttp.readyState == 1)
  {
    myDiv.innerHTML += "Request status: 1 (loading) <br/>";
  }
  else if (xmlHttp.readyState == 2)
  {
    myDiv.innerHTML += "Request status: 2 (loaded) <br/>";
  }
  else if (xmlHttp.readyState == 3)
  {
    myDiv.innerHTML += "Request status: 3 (interactive) <br/>"; 
  }
  else if (xmlHttp.readyState == 4)
  {
    if(xmlHttp.status == 200)
    {
      try
      {
        handleXMLData();
      }
      catch(e)
      {
        alert("Error reading the response: " + e.toString());
      }
    }
    else
    {
      alert("Problem retrieving data:\n" + xmlHttp.statusText);
    }


  }

}

function handleXMLData()
{
  var xmlResponse = xmlHttp.responseXML;

   xmlRoot = xmlResponse.documentElement;

  idArray = xmlRoot.getElementsByTagName("id");  
  titleArray = xmlRoot.getElementsByTagName("title");
  authorArray = xmlRoot.getElementsByTagName("author");   

  var html = "";

  for( var i=0; i<titleArray.length; i++)
  {
    html += idArray.item(i).firstChild.data + ", " + titleArray.item(i).firstChild.data +  ", " + authorArray.item(i).firstChild.data + "<br/>";
  }
  myDiv = document.getElementById("myDivElement");
  myDiv.innerHTML += "Server says: <br/>" + html;  
}
console.log(xmlRoot); 
</script>
</head>

<body onload="process()">
Our collections:
<div id="myDivElement" />
</body>
</html>

Above code is taken from: http://www.phpeveryday.com/articles/AJAX-Client-Side-Processing-XML-Data-use-XMLHttpRequest-P356.html

In this function function handleXMLData(), some places use var such as var xmlResponse = xmlHttp.responseXML;, some places did not use var, such as: xmlRoot = xmlResponse.documentElement; so my question is:

  1. why not put var in front of xmlRoot?

  2. usually inside function(){}, if we do not put var in front of variable, it will be global variable, such as:

    function test() { gar = '9';} test(); console.log(gar);

But when I put console.log(xmlRoot); just before tag </script>, in chrome console, it shows:Uncaught ReferenceError: xmlRoot is not defined, why? Is not xmlRoot a global variable since there is no var in front of it?

4

2 回答 2

0
  1. var可能没有在这里使用，因为作者希望变量是全局变量
  2. 它抛出错误是因为什么时候console.log(xmlRoot);，执行上下文不知道xmlRoot因为handleXMLData可能还没有执行（因为它在回调函数中用于异步调用）
于 2013-07-10T04:10:15.610 回答
0

xmlRoot如果已定义，它将是一个全局变量。如果引用它的函数没有被调用，xmlRoot则不会被定义。

您xmlRoot在脚本退出之前进行了测试，即在代码的第一次执行期间，在handleXMLData()调用之前。

于 2013-07-10T04:15:47.020 回答