H5单页面系统开发,动态加载js

站长手记 作者: 2024-08-27 23:50:01
最近开发一个手机端办公系统,用了Framework7框架,完全用H5开发网站我也是第一次上手,很不熟练,很多概念也不知道。Framework7采用单页面模式,所有功能都在一个主页面上完成,用Ajax方式调用其他页面
var i93comm = {};
//动态加载一个js/css文件
i93comm.loadjscssfile=function(filename, filetype) {
    if (filetype == "js") {
        var fileref = document.createElement('script');
        fileref.setAttribute("type", "text/javascript");
        fileref.setAttribute("src", filename);
        document.getElementsByTagName("body")[0].appendChild(fileref);
    }
    else if (filetype == "css") {
        var fileref = document.createElement("link");
        fileref.setAttribute("rel", "stylesheet");
        fileref.setAttribute("type", "text/css");
        fileref.setAttribute("href", filename);
        document.getElementsByTagName("head")[0].appendChild(fileref);
    }
}

//移动已经加载过的js/css
i93comm.removejscssfile=function(filename, filetype) {
    var targetelement = (filetype == "js") ? "script" : (filetype == "css") ? "link" : "none";
    var targetattr = (filetype == "js") ? "src" : (filetype == "css") ? "href" : "none";
    var allsuspects = document.getElementsByTagName(targetelement);
    for (var i = allsuspects.length; i >= 0; i--) {
        if (allsuspects[i] && allsuspects[i].getAttribute(targetattr) != null && allsuspects[i].getAttribute(targetattr).indexOf(filename) != -1)
            allsuspects[i].parentNode.removeChild(allsuspects[i]);
    }
}

//替换已经加载的js / css文件,代码如下:
i93comm.createjscssfile = function (filename, filetype) {
    if (filetype == "js") {
        var fileref = document.createElement('script');
        fileref.setAttribute("type", "text/javascript");
        fileref.setAttribute("src", filename);
    }
    else if (filetype == "css") {
        var fileref = document.createElement("link");
        fileref.setAttribute("rel", "stylesheet");
        fileref.setAttribute("type", "text/css");
        fileref.setAttribute("href", filename);
    }
    return fileref;
}
    
i93comm.replacejscssfile = function (oldfilename, newfilename, filetype) {
    var targetelement = (filetype == "js") ? "script" : (filetype == "css") ? "link" : "none";
    var targetattr = (filetype == "js") ? "src" : (filetype == "css") ? "href" : "none";
    var allsuspects = document.getElementsByTagName(targetelement);
    for (var i = allsuspects.length; i >= 0; i--) {
        if (allsuspects[i] && allsuspects[i].getAttribute(targetattr) != null && allsuspects[i].getAttribute(targetattr).indexOf(oldfilename) != -1) {
            var newelement = i93comm.createjscssfile(newfilename, filetype);
            allsuspects[i].parentNode.replaceChild(newelement, allsuspects[i]);
        }
    }
}
routes: [
        {
            path: '/procurement/declare/',
            url: '/pages/procurement/declare.html',
            on: {
                pageInit: function (event, page) {
                    i93comm.loadjscssfile("js/procurement/declare.js?v=0.2", "js");
                },
                pageBeforeIn: function (event, page) {
                },
                pageAfterIn: function (event, page) {
                    getDepartmentList();
                },
                pageBeforeRemove: function (event, page) {
                    i93comm.removejscssfile("js/procurement/declare.js?v=0.2", "js");
                },
            }
        },
        {
            path: '/procurement/approval/',
            url: '/pages/procurement/approval.html',
        },
    ],
原创声明
本站部分文章基于互联网的整理,我们会把真正“有用/优质”的文章整理提供给各位开发者。本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
本文链接:http://www.jiecseo.com/news/show_69818.html