After the completion of the CSS loading automatically determine whether the page to add CSS or JS file _jquery

Recently in the framework of writing projects, write a Jquerymessagebox class, to use the JQuery UI dialog () to display the message box, in order to make the method easy to invoke, it is added to automatically determine whether the page is joined Ui.js and UI.CSS, the code is as follows:

If Ui.js is not included, reference if 
($ (' script[src$= ' jquery-ui-1.8.11.custom.min.js ' "] '). Length = = 0) { 
$ (" "<script Src= '/js/jquery-ui-1.8.11.custom.min.js ' type= ' text/javascript '/> ' ""). Appendto (' head '); 
} 
If CSS is not loaded, then load if 
($ (' link[ref$= ' jquery-ui-1.8.14.custom.css ' "] '). Length = = 0) { 
$ (' <link href="/css /jquery-ui-1.8.14.custom.css "" rel= "" Stylesheet "" type= "" Text/css ""/> "). Appendto (' head '); 

Dialog () script 
}}

But CSS code does not immediately load down, so in the display dialog will not have a style (in IE9, because the IE9 under the CSS even after downloading, will redraw the page elements, and IE8 will not). To solve this problem, you can use Ajax, when the CSS loaded, and then display dialog, so you can display the style, the code is as follows:

 if ($ (' link[ref$= ' jquery-ui-1.8.14.custom.css ' "] '). Length = = 0) {$.ajax ({url: '/css/j Query-ui-1.8.14.custom.css ', success:function (data) {///create a STYLE element and append to head//replace the path of images $ (' <style type= ' Tex 
T/css ">" + data.replace (/url\ (images/g, ' url (/css/images ') + ' </style> '). Appendto (' head '); 
dialog () script; 
} 
}); 
else {//dialog () script; }