5
se uso la sintassi jQuery: $("<img src='img.jpg'>"), l'immagine verrà effettivamente scaricata sul client? o devo appenderlo al corpo per scaricarlo?
A
risposta
6
Non è necessario aggiungere l'elemento immagine al documento per l'immagine da caricare.
L'elemento immagine stesso richiederà l'immagine non appena la si crea (e non appena ha un valore src).
Guarda l'acivity netto (in Firebug Tools/Developer) quando si esegue questo: http://jsfiddle.net/Guffa/AvgVN/
Google "javascript preload" per trovare tonnellate di esempi di codice che utilizza questo.
5
Sì, l'immagine verrà scaricata immediatamente.
Anche se l'elemento Image che è stato creato non è ancora nel DOM, il browser inizierà comunque a scaricarlo non appena è impostato l'attributo .src.
Utilizzando il proprio avatar, ho appena fatto questo nella console:
> i = $('<img src="http://graph.facebook.com/100002351317104/picture?type=large">');
...
> i[0].width
180
mostrando che l'immagine è effettivamente caricato.
Se ci pensi, questo in realtà deve essere il caso altrimenti il pre-caricamento dell'immagine non potrebbe mai funzionare. Il precaricamento delle immagini dipende dalla creazione di un nodo distaccato Image e dall'impostazione di src, che è esattamente ciò che farà lo $("<img src=...>").
+0
+1 È * effettivamente * scaricato immediatamente! – techfoobar
2
Direi di sì, o forse dipende dal browser.
$("<img src='http://crssrd.com/web_apps/index/themes/crssrd.com/images/loading.gif'>")
Verifica questo su Chrome per esempio: http://jsfiddle.net/SMnhU/ immagine è immediatamente scaricato.
+0
Puoi fornire un esempio in cui un browser non esegue immediatamente il download dell'immagine? –
+0
No, tutti i browser che ho provato lo scaricano istantaneamente. Ma non ho provato l'opera per esempio, ma sarei davvero sorpreso se fosse diverso per questo browser. –
+0
Quindi forse è sicuro dire che non dipende dal browser :) –
Problemi correlati
- 1. Recupera bambino img src (jQuery)
- 2. jquery controlla se img ha src
- 3. jQuery seleziona img con src
- 4. <img src> w/timeout?
- 5. Sostituisci dinamicamente l'attributo img src con jQuery
- 6. vedi se src of img esiste
- 7. javascript controlla se img src è valido?
- 8. Perché non posso fare <img src="C:/localfile.jpg">?
- 9. L'editor TinyMCE aggiunge data-mce-src a <img />
- 10. PHP - sostituire <img> tag e restituire src
- 11. react.js Sostituisci img src onerror
- 12. Angular2: mostra l'immagine segnaposto se img src non è valido
- 13. JQuery set img src a seconda di dove si sceglie
- 14. Modifica IMG SRC con Javascript
- 15. jQuery modifica <img> src con $ (selettore) .prop richiede molto tempo
- 16. Errore console angolare img src
- 17. JQuery modifica il valore di un <img src="" by ID
- 18. XPath seleziona collegamenti immagine - link genitore href di img src solo se esiste, altrimenti seleziona img src link
- 19. Aggiorna <img> in jQuery periodicamente
- 20. Angular.js - Filtro nel tag img src
- 21. angolare 2 img src in un percorso relativo
- 22. jquery callback sul caricamento dell'immagine quando si cambia src
- 23. Ottieni src di img element da div?
- 24. XPath to Parse "SRC" dal tag IMG?
- 25. Python 2.7 Beautiful Soup img src Estratto
- 26. Rimozione occhi rossi da un'immagine sul lato client utilizzando jQuery
- 27. Scambia immagine src con jquery
- 28. document.write ('<scr' + 'ipt src = vs <script src =
- 29. JQuery cambia tonalità, saturazione, gamma di <img>?
- 30. Mobile Safari esegue il rendering di <img src="data:image/jpeg;base64..."> ridimensionato su tela?
Ho pensato che fosse sbagliato ma non lo è! Ora ricordo che gli script di "preloader di immagine" degli ultimi anni '90 funzionavano anche in quel modo. –
Anch'io. Il fatto è che è in realtà scaricato immediatamente! – techfoobar