2010-12-23 24 views
7

मैं जावास्क्रिप्ट के साथ बहुत नया हूं।जावास्क्रिप्ट दस्तावेज़ ओवरराइटिंग पेज लिखते हैं?

मैं एक ऐसी शैली जोड़ने के लिए document.write (वर्डप्रेस के साथ) का उपयोग करके एक टैग बनाने की कोशिश कर रहा हूं जो पहले से लोड होने से पहले छवियों को छुपाता है। सीएसएस के माध्यम से लोड होने से पहले छवियों को छिपाने के लिए मुझे जावास्क्रिप्ट शैली लिखना पड़ा। मैं वास्तव में इसे सीएसएस फ़ाइल में लिखना नहीं चाहता हूं क्योंकि उपयोगकर्ता को जावास्क्रिप्ट अक्षम है और फिर छवियां कभी नहीं दिखाई देंगी। यह सिर्फ पूरे पृष्ठ अधिलेखन है,

jQuery(function($) { 
    document.write('<style type="text/css"> .preload img { display: none; } </style>'); 
    $('#body-wrap').preloadThis(); 
}); 

लेकिन और यह खाली जाना बनाने:

मैं काम करने के लिए इस कोड को प्राप्त करने की कोशिश कर रहा हूँ। मैं इसे कैसे रोक सकता हूँ? मैं पृष्ठ को हटाए बिना टैग जोड़ना चाहता हूं। 'वापसी' का उपयोग करने की कोशिश की, कोई भाग्य नहीं।

क्षमा करें, मैं एक नौसिखिया हूँ। अग्रिम में धन्यवाद।

उत्तर

18

document.write() का उपयोग करके पृष्ठ implicitly calls document.open() लोड हो गया है, जो एक नया पृष्ठ बनाता है। आप आम तौर पर document.write() से बचने और उचित डोम निर्माण तकनीक पर बने रहें या jQuery के आशुलिपि निर्माण विधियों का उपयोग करना चाहिए:

jQuery(function($) { 
    $('<style type="text/css"> .preload img { display: none; } </style>') 
     .appendTo("head"); 
    $('#body-wrap').preloadThis(); 
}); 


मैं आपको लगता है कि करने के लिए पेज से लोड किए गए हैं HTML या CSS फ़ाइलों को संपादित नहीं कर सकते हैं यह सोचते हैं रहा हूँ इस नियम को शामिल करें? अगर ऐसी बात है, और आप इन शैलियों पेज से पहले लागू लोड न हो, document.write() jQuery तैयार हैंडलर से बाहर ले हैं:

// write() before the document finishes loading 
document.write('<style type="text/css"> .preload img { display: none; } </style>'); 
jQuery(function($) { 
    $('#body-wrap').preloadThis(); 
}); 

यह वर्तमान में क्रियान्वित <script> टैग के तुरंत बाद <style> टैग लिखेंगे। उम्मीद है कि यह आपके <head> तत्व में है <style> कहीं और अमान्य है, हालांकि सभी ब्राउज़रों को इसे किसी भी तरह से ठीक करना चाहिए।

+0

.hide() .. के उपयोग के समान समस्या। जब छवियों को कैश किया जाता है (पिछले पृष्ठ लोड पर लोड किया जाता है) वे jQuery लागू होने से पहले दिखाई दे रहे हैं। यह छिपे जाने से पहले छवि को प्रकट होने का कारण बनता है, फिर प्रीलोड प्लगइन द्वारा फीका हुआ .. छिपाने से पहले झिलमिलाहट से छुटकारा पाने की कोशिश कर रहा है। –

+0

@ मैथ्यू: मैंने अपना जवाब अपडेट कर लिया है। यदि पृष्ठ लोडिंग समाप्त नहीं हुआ है, तो 'document.write' का उपयोग करना सुरक्षित है, इसलिए यदि आप इसे jQuery के दस्तावेज़ तैयार हैंडलर से बाहर लेते हैं तो आपको ठीक होना चाहिए। –

3

आप <style> टैग को जोड़ने के लिए, आप बस jQuery के साथ उन्हें छिपा सकते हैं की जरूरत नहीं है:

jQuery(function($) { 
    $('.preload img').hide(); 
    $('#body-wrap').preloadThis(); 
}); 

कैसे अपने preloadThis() समारोह काम करता है पता नहीं है, लेकिन मैं इसे छवियों को लोड करता है और से .preload वर्ग को हटा लगता है img कंटेनर। अगर यह वास्तव में ऐसा काम करता है, तो यह कोड आपकी मदद नहीं करेगा - छवियां छिपी रहेंगी।

+0

नहीं, यह सभी छवियों को .preload के भीतर पाता है और उन्हें फेंक देता है। .hide() के साथ समस्या यह है कि छवियों को कैश किए जाने पर यह पर्याप्त तेज़ नहीं है, इसलिए छवि छिपी जाने से पहले एक अलग दूसरे के लिए दृश्यमान होती है , तो वे फीका हो गया है। बहुत अच्छा नहीं लग रहा है। –

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