JavaScript 8 lines of code to fix JS file introduction problem

Single page operation, inevitably there will be a variety of JSP nesting problems, an operation page may involve dozens of or even hundreds of JSP pages.

Usually we use the introduction of the JS file, will be placed in the header of index.

　　But let's think about three questions:

1, when the business needs to use the IFRAME, then the IFRAME page will no longer directly invoke the JS file index introduced

2, if I have 100 JSP pages of this project, there is a JS file only one of the JSP to use, I will put this JS into the header area of index, each time a load project will load it, is not an extension of the project load time.

3, for problem two, we make some improvements, only in the reference to this JS JSP page with script to introduce the JS. This really saves efficiency, but there is a problem to consider, each time the JSP page is loaded, the JS file will be reloaded. If I have this JS file for DOM operations, such as append something to an element. So every time the JSP file is loaded, the append operation will be performed, which is obviously not what we expected.

　　

So, with the three questions above, we tried to encapsulate a global approach that could refer to JS:

function Loadjs (names) {    var Namearr = Names.split (",");    for (Var i=0;i<namearr.length;i++) {        var name = Namearr[i];        if (!name) continue;        if ($ ("head script[src$=" + name + ". JS ']"). Length = = 0) {            $ ("Head"). Append (' <script type= ' Text/javascript "src=" ' + prefix + '/res/js/' + name + '. js ' ></script> ')}}}    

　　There are two benefits to this approach:

1, flexibility, can be called throughout the project, when you use this JS file to call this method. If all the JS files are placed in the header of index, the project will load slowly. Called only when applied, which is simple and clear, but also improves efficiency.

2, only load once, for problem 3, when you load to use this method to invoke JS page, this JS will be placed in the index header cache, the next time the load page will be from the cache to take this JS, will not be loaded repeatedly.

　　

　　Improvements are as follows:

　

JSP page demonstrates the use of the Loadjs method, here cited 4 JS files, reduce the loading time of the project home page, interested students can learn from it.

JavaScript 8 lines of code to fix JS file introduction problem