2013-07-10 2 views
0

Books.xml:некоторые проблемы с использованием/без использования 'вар' в JavaScript

<?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;, некоторые места не использовали var, такие как: xmlRoot = xmlResponse.documentElement; поэтому мой que Stion является:

  1. почему бы не поставить var перед xmlRoot?

  2. обычно внутри функции() {}, если мы не ставим вар перед переменной, то это будет глобальная переменная, например:

    тест функции() {гар = '9';} test(); console.log (gar);

Но когда я ставлю console.log(xmlRoot); непосредственно перед тегом </script>, в хромированной консоли, она показывает: Uncaught ReferenceError: xmlRoot не определен, то почему? Разве не xmlRoot глобальная переменная, так как перед ней нет var?

+0

Все, что зависит от удаленного считывания данных в браузере, должно выполняться обработчиком ответа. Обработчик ответа может даже вызвать дополнительные функции, которые вы пишете, если это полезно. В противном случае код, скорее всего, запустится слишком быстро, и данные не будут существовать. – Paul

+0

Я уверен, что если вы напишете 'setTimeout (function() {console.log (xmlRoot)}, 10000); 'xmlRoot будет определен. Магия асинхронного вызова! –

+0

@ Karl-AndréGagnon - Надеюсь, вы просто предлагаете это как быстрый тест. Обычно вы должны использовать обратный вызов, а не ждать произвольного количества времени, чтобы что-то произошло. – jahroy

ответ

0
  1. var не могут быть использованы здесь, потому что автор хочет переменной быть глобальным один
  2. Он бросает ошибку, потому что, когда console.log(xmlRoot);, контекст выполнения не знает о xmlRoot, поскольку handleXMLData не может быть выполнено еще (потому что он используется в функции обратного вызова для асинхронного вызова)
0

xmlRoot будет глобальной переменной, если она определена. Если функция, которая ссылается на нее, не была вызвана, xmlRoot не будет определен.

Вы протестировали xmlRoot непосредственно перед тем, как сценарий завершится, то есть во время первого выполнения кода, до того, как был вызван handleXMLData().

Смежные вопросы