0

書籍.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>

上記のコードはhttp://www.phpeveryday.com/articles/AJAX-Client-Side-Processing-XML-Data-use-XMLHttpRequest-P356.htmlから取得したものです。

この関数function handleXMLData()では、 などをvar使用var xmlResponse = xmlHttp.responseXML;している場所もあれば、 を使用していない場所もあるので、私の質問は次のとおりです。varxmlRoot = xmlResponse.documentElement;

  1. varの前に 置いてみませんxmlRootか？

  2. 通常は function(){} 内で、変数の前に var を置かない場合、次のようなグローバル変数になります。

    function test() { gar = '9';} テスト(); console.log(ガー);

しかし、chrome コンソールでconsole.log(xmlRoot);tag の直前に置くと</script>、次のように表示されます: Uncaught ReferenceError: xmlRoot is not defined, なぜ? 前に何もないのでxmlRoot、グローバル変数ではありませんvarか?

4

2 に答える 2

0
  1. var作成者は変数をグローバルなものにしたいので、ここでは使用していない可能性があります
  2. まだ実行されていない可能性があるため、実行コンテキストが認識されないため、エラーがスローされます（非同期呼び出しへのコールバック関数で使用されるconsole.log(xmlRoot);ため）xmlRoothandleXMLData
于 2013-07-10T04:10:15.610 に答える
0

xmlRoot定義されている場合はグローバル変数になります。それを参照する関数が呼び出されていない場合、xmlRoot定義されません。

xmlRootスクリプトが終了する直前、つまりコードの最初の実行中に、呼び出される前にテストしましhandleXMLData()た。

于 2013-07-10T04:15:47.020 に答える