2012-11-02 14 views
15

मैं स्टैक ओवरफ़्लो और सामान्य रूप से कोडिंग करने के लिए नया हूं। मैं एक एक्सएमएल फ़ाइल लेने और जावास्क्रिप्ट का उपयोग कर ब्राउज़र में इसे प्रस्तुत करने की कोशिश कर रहा हूं। मैं ऐसा करने के तरीके के कुछ नमूना कोड पर चारों ओर देखा और निम्न कोड के साथ आया है:किसी XML फ़ाइल को पार्स करने के लिए जावास्क्रिप्ट का उपयोग

<!DOCTYPE html> 
<html> 
<body> 

<script> 
if (window.XMLHttpRequest) 
    {// code for IE7+, Firefox, Chrome, Opera, Safari 
    xmlhttp=new XMLHttpRequest(); 
    } 
else 
    {// code for IE6, IE5 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    xmlhttp.open("GET","social.xml",false); 
    xmlhttp.send(); 
    xmlDoc=xmlhttp.responseXML; 

document.write("<table border='1'>"); 
var x=xmlDoc.getElementsByTagName("CD"); 
for (i=0;i<x.length;i++) 
    { 
    document.write("<tr><td>"); 
    document.write(x[i].getElementsByTagName("c_id")[0].childNodes[0].nodeValue); 
    document.write("</td><td>"); 
    document.write(x[i].getElementsByTagName("facebook_id")[0].childNodes[0].nodeValue); 
    document.write("</td></tr>"); 
    } 
    document.write("</table>"); 
</script> 

</body> 
</html> 

वैसे भी, जब मैं डेटा है कि मैं में प्रदर्शित करने के लिए कोशिश कर रहा हूँ की मेरी स्थानीय सर्वर से कोई भी इस पर चलाने टेबल प्रकट होता है। मेरी .html फ़ाइल और .xml फ़ाइल एक ही फ़ोल्डर में हैं, इसलिए मेरा मानना ​​है कि मेरे पास सही फ़ाइल पथ है। मैं बस यहां एक रूकी गलती कर रहा था, लेकिन मैं अपने जीवन के लिए यह नहीं समझ सकता कि c_id और facebook_id मानों को सूचीबद्ध करने वाली तालिका क्यों नहीं बनाई जा रही है। मैंने जवाब के लिए चारों ओर देखा और कोई भी खोजने में सक्षम नहीं है। किसी भी तरह की सहायता का स्वागत किया जाएगा। धन्यवाद!

+0

क्या ब्राउज़र आप इस परीक्षण करने के लिए प्रयोग कर रहे हैं? क्या यह किसी भी त्रुटि की रिपोर्ट कर रहा है? –

उत्तर

12

अनुरोध भेजने से पहले xmlhttprequest पर आपको onload ईवेंट श्रोता जोड़ने की आवश्यकता है। साथ ही, आपको XML को DOMParser के साथ पार्स करने की आवश्यकता हो सकती है। वैसे भी, इस आधुनिक ब्राउज़रों पर काम करना चाहिए:

<!DOCTYPE html> 
<html> 
    <body> 

     <script> 
      if (window.XMLHttpRequest) 
      {// code for IE7+, Firefox, Chrome, Opera, Safari 
       xmlhttp=new XMLHttpRequest(); 
      } 
      else 
      {// code for IE6, IE5 
       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
      } 



      xmlhttp.onload = function() { 
       var xmlDoc = new DOMParser().parseFromString(xmlhttp.responseText,'text/xml'); 

       console.log(xmlDoc); 

       document.write("<table border='1'>"); 
       var x=xmlDoc.getElementsByTagName("CD"); 
       for (i=0;i<x.length;i++) 
       { 
        document.write("<tr><td>"); 
        document.write(x[i].getElementsByTagName("c_id")[0].childNodes[0].nodeValue); 
        document.write("</td><td>"); 
        document.write(x[i].getElementsByTagName("facebook_id")[0].childNodes[0].nodeValue); 
        document.write("</td></tr>"); 
       } 
       document.write("</table>"); 

      } 


      xmlhttp.open("GET","social.xml",false); 
      xmlhttp.send(); 
      </script> 

    </body> 
</html> 

अब, क्या आप कर रहे हैं के बारे में उल्लेख के लायक चीजों की सिर्फ एक जोड़े:

  • xmlhttprequest वस्तुओं कई विभिन्न मापदंडों कि की एक किस्म का मतलब है चीजें: readystate, स्थिति कोड, काम करता है। आप उन लोगों में थोड़ा और अधिक देखने का लाभ उठा सकते हैं।

  • document.write वास्तव में कभी भी कभी भी उपयोग नहीं किया जाना चाहिए। वास्तव में, एचटीएमएल इंजेक्शन के किसी भी साधन को बहुत सावधानी से संभाला जाना चाहिए। आप कई MVC-esque चौखटे में एक टेम्पलेट आधारित समाधान आम, या mine इस्तेमाल कर सकते हैं अगर आप चाहते हैं :)

संबंधित मुद्दे