Example of jquery ajax () dynamic loading of script files

Last said jquery dynamic loading script, using Getscript (you can click on the relevant article to view), shortcomings and advantages are said. The encapsulated function is not cached, and the local script is refreshed by default for each load. Such a feature for the network is not very fast Web site, that is a long wait, although the page has been loaded, but the script is still on the road, the visitors will think that the script failed to load, will repeatedly refresh the page, the results of each load script is retrieved, resulting in the interruption of resources and a large number of server requests. To solve this problem, I wrote a method of my own, haha, of course, according to getscript the Ajax method of packaging into a function to facilitate multiple reuse.

<! DOCTYPE html>
<meta charset= "Utf-8" >
<title> Dynamic Loading js</title>
<script type= "Text/javascript" src= "Http://lib.sinaapp.com/js/jquery/1.8/jquery.min.js" ></script>
<script language= "JavaScript" >
function Yundanran_getscript (src,version,success,error)
{
var url= (version== ' ¦¦!version)?
Src:
(
/\?. */.test (SRC)?
src+ ' &v= ' +version.replace (/\s/g, '):
src+ ' v= ' +version.replace (/\s/g, ")
);
$.ajax (
{
Url:url,
Cache:true,
Type: ' Get ',
DataType: ' Script ',
Success:function ()
{
if (Success && $.isfunction (Success))
Success ();
},
Error:function ()
{
if (Error && $.isfunction (error))
Error ();
}
});
}
Yundanran_getscript (' Http://code.jquery.com/ui/1.8.24/jquery-ui.min.js ', New Date (). GetTime (). toString ());
</script>

The result is obvious that the client does not have a cached script. If the version parameter is cached to a fixed value, it is cached on the client after the first load.

Write to here, do not know you have not thought, that is the script load failed to do? You may have noticed the error function of Ajax, let's try:

The correct resource situation:

<! DOCTYPE html>
<meta charset= "Utf-8" >
<title> Dynamic Loading js</title>
<script type= "Text/javascript" src= "Http://lib.sinaapp.com/js/jquery/1.8/jquery.min.js" ></script>
<script language= "JavaScript" >
function Yundanran_getscript (src,version,success,error)
{
var url= (version== ' ¦¦!version)?
Src:
(
/\?. */.test (SRC)?
src+ ' &v= ' +version.replace (/\s/g, '):
src+ ' v= ' +version.replace (/\s/g, ")
);
$.ajax (
{
Url:url,
Cache:true,
Type: ' Get ',
DataType: ' Script ',
Success:function ()
{
if (Success && $.isfunction (Success))
Success ();
},
Error:function ()
{
if (Error && $.isfunction (error))
Error ();
}
});
}
Yundanran_getscript (' http://code.jquery.com/ui/1.8.24/jquery-ui.min.js ', ' * '), function ()
{
Alert (' loaded successfully ');
},
function ()
{
Alert (' Load failed ');
});
</script>

"Load Success" will pop up!

If the resource is not valid:

<! DOCTYPE html>
<meta charset= "Utf-8" >
<title> Dynamic Loading js</title>
<script type= "Text/javascript" src= "Http://lib.sinaapp.com/js/jquery/1.8/jquery.min.js" ></script>
<script language= "JavaScript" >
function Yundanran_getscript (src,version,success,error)
{
var url= (version== ' ¦¦!version)?
Src:
(
/\?. */.test (SRC)?
src+ ' &v= ' +version.replace (/\s/g, '):
src+ ' v= ' +version.replace (/\s/g, ")
);
$.ajax (
{
Url:url,
Cache:true,
Type: ' Get ',
DataType: ' Script ',
Success:function ()
{
if (Success && $.isfunction (Success))
Success ();
},
Error:function ()
{
if (Error && $.isfunction (error))
Error ();
}
});
}
Yundanran_getscript (' http://code.jquery.com/ui/1.8.24/jquery-ui.min2.js ', ' * '), function ()
{
Alert (' loaded successfully ');
},
function ()
{
Alert (' Load failed ');
});
</script>

Obviously the URL is 404, but there is no "load failed" pop-up.

If this is the case, then the script load fails and we can't control it. I also thought that if the script load failed to continue loading, it would seem to be a further alternative.