जावास्क्रिप्ट फ़ंक्शन अप्रत्याशित तरीके से काम करता है

मुझे जावास्क्रिप्ट फ़ंक्शन 'डूअल' मिला है, जो <p>, </p> टैग के बीच रखे गए सभी टेक्स्ट को लिखना है। मेरे कोड में यह दो तरीकों से प्रयोग किया जाता है।जावास्क्रिप्ट फ़ंक्शन अप्रत्याशित तरीके से काम करता है

यह सही ढंग से काम करता है जब मैं इसे पृष्ठ के अंत में कॉल करता हूं। हालांकि क्लिक-बटन ईवेंट होने पर इसे ट्रिगर भी किया जाना चाहिए। किसी कारण से यह ऐसा नहीं करता है जो इस बार करना है। जब कोई बटन पर क्लिक करता है तो यह केवल पहले <p>...</p> HTML तत्व के आंतरिक HTML को प्रिंट करता है।

मेरा प्रश्न यह है कि यह इन दो परिस्थितियों में अलग-अलग काम करता है और मुझे इस समस्या को ठीक करने के लिए क्या करना चाहिए।

<!DOCTYPE html> 
<html> 
    <head> 
     <script> 
      function returnList(x) 
      { 
       return document.getElementsByTagName(x); 
      } 

      function writeList(x) 
      { 
       var i = 0; 

       while (x[i]) 
       { 
        document.write(x[i++].innerHTML + '<br/>'); 
       } 
      } 

      function doAll(x) 
      { 
       writeList(returnList(x)); 
      } 
     </script> 
    </head> 

    <body> 
     <p>XXX</p> 
     <p>YYY</p> 
     <div style = 'background-color: gray;'> 
      <p>YYY</p> 
      <p>XXX</p> 
     </div> 

     <button type = 'button' onclick = "doAll('p')"> 
      Click me! 
     </button> 

     <script> 
      document.write('<br/>'); 
      doAll('p'); 
     </script> 
    </body> 
</html>

यहाँ 'उत्पादन' है:
XXX
YYY
YYY
XXX

XXX
YYY
YYY
XXX

और यहाँ क्या एक कर सकते हैं है बटन पर क्लिक करने के बाद देखें:
XXX

स्रोत

2013-07-15 Hubert Siwkin

क्यों पहले उत्पादन हालांकि वहाँ केवल 4 पी टैग कर रहे हैं 8 लाइनों से मिलकर करता है? ऐसा लगता है कि क्लिक पर जल्दी चल रहा है। –

याद रखें: 'डीबगर' + ब्राउज़र डेवलपर टूल हमेशा आपके मित्र होते हैं। – DontVoteMeDown

@ लार्सएबर्ट: नहीं, यह क्लिक बटन की वजह से नहीं है। आउटपुट की चार अतिरिक्त लाइनें मेरे कोड की छह अंतिम पंक्तियों का परिणाम हैं: डी। जैसा कि आप देख सकते हैं कि 'doAll' फ़ंक्शन अनुभाग के नीचे स्वचालित रूप से ट्रिगर किया गया है। –

समस्या यह है कि पेज को पहले से ही, प्रदान की गई है, जब आप अपने बटन पर क्लिक करें है। इस बिंदु पर document.write() ट्रिगरिंग पूरे दस्तावेज़ को ओवरराइड कर देगा। यह पहला तत्व लिखता है, क्योंकि यह एकमात्र तत्व है जो अभी भी मौजूद है, जब आपने अपना फ़ंक्शन ट्रिगर किया था। किसी भी अन्य तत्व को पहली बार document.write() निष्पादित करने के बाद वहां नहीं होगा।

यहां तक कि आपका कार्य स्वयं दस्तावेज़ का हिस्सा नहीं होगा।

function writeList(x) { 
    var i = 0, data = ""; 

    while (x[i]) { 
     data += x[i++].innerHTML + '<br/>'; 
    } 

    document.write(data); 
}

स्रोत

2013-07-15 13:26:00 Amberlamps

document.write केवल उस दस्तावेज़ को सामग्री लिखने में सक्षम है जो वर्तमान में लोड हो रहा है। एक बार लोड होने पर, यह थोड़ा अलग व्यवहार करता है - https://developer.mozilla.org/en-US/docs/Web/API/document.write देखें। अपना वांछित आउटपुट लिखने के लिए विशेष कंटेनर तत्व और innerHTML का उपयोग करें।

function writeList(list) { 
    var i, result = ""; 
    for (i = 0; i < list.length; i++) { 
     result += list[i].innerHTML + "<br />"; 
    } 
    document.getElementById("myContainer").innerHTML = result; 
}

http://jsfiddle.net/3yPAW/1/

स्रोत

2013-07-15 13:23:24

वास्तव में आपके 'लूप' में 'if' की आवश्यकता नहीं है। बस 'परिणाम + = सूची [i] .innerHTML + "
"; '। – Amberlamps

हटाया गया ... इसे इंगित करने के लिए धन्यवाद। –

अन्य दो जवाब समझाया क्यों, मैं: अगर आप MUST साथ document.write() या तुम सिर्फ परीक्षण कारणों के लिए इसका उपयोग करना चाहते काम करते हैं, आप किसी भी तरह "कैश" अपने डेटा और एक ही बार में यह उत्पादन करने के लिए है आपको सुझाव होगा कि कैसे इससे बचें:

अपने HTML को शरीर (या अन्य तत्व) के innerHTML में जोड़ें;

document.write(x[i++].innerHTML + '<br/>');

उपयोग की बजाय

document.getElementsByTagName("body")[0].innerHTML += x[i++].innerHTML + '<br/>';

डेमो: http://jsfiddle.net/MNCbx/

स्रोत

2013-07-15 13:30:48

जावास्क्रिप्ट फ़ंक्शन अप्रत्याशित तरीके से काम करता है

उत्तर

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