那现在来看一个使用Ajax实现图片预加载的方法。该方法利用DOM,不仅仅预加载图片,还会预加载CSS、JavaScript等相关的东西。使用Ajax,比直接使用JavaScript,优越之处在于JavaScript和CSS的加载不会影响到当前页面。该方法简洁、高效。
window.onload = function() { setTimeout(function() { // XHR to request a JS and a CSS var xhr = new XMLHttpRequest(); xhr.open(‘GET‘, ‘http://domain.tld/preload.js‘); xhr.send(‘‘); xhr = new XMLHttpRequest(); xhr.open(‘GET‘, ‘http://domain.tld/preload.css‘); xhr.send(‘‘); // preload image new Image().src = "http://domain.tld/preload.png"; }, 1000); };
上面代码预加载了“preload.js”、“preload.css”和“preload.png”。1000毫秒的超时是为了防止脚本挂起,而导致正常页面出现功能问题。
原文:http://www.cnblogs.com/TangYR168/p/6363158.html