zoukankan      html  css  js  c++  java
  • 异步加载js,Css方法

    <!doctype html>
    <html>
    <head>
        <meta charset="utf-8">
        <title>Loading Script and Style File</title>
    </head>
        <body>
            <div id="out">
            </div>
            <script>
                //加载ok.css
                AsynLoadCss('ok.css','body', function () {
                
                });
                //加载jquery
                AsynLoadJs('jquery-1.7.1.js','body', function () {
                    //加载完成后的代码!
                    $(document).ready(function () {
                        $("#out").html("加载完成后的代码!");
                    });
                    
                });
                
            //异步加载js方法
            function AsynLoadJs(src, target, callback) {
                var node = document.createElement('script'),
                        outEl;
                switch (target) {
                    case 'body':
                        outEl = document.body;
                        break;
                    case 'head':
                        outEl = document.getElementsByTagName('head')[0];
                        break;
                    default:
                        outEl = document.getElementsByTagName('head')[0];
                }
                node.type = 'text/javascript';
                if (node.addEventListener) {
                    node.addEventListener('load', callback, false);
                    node.addEventListener('error', function () {
                        //error function
                    }, false);
                }
                else { // for IE6-8
                    node.onreadystatechange = function () {
                        var rs = node.readyState;
                        if (rs === 'loaded' || rs === 'complete') {
                            node.onreadystatechange = null;
                            callback();
                        }
                    };
                }
                node.src = src;
                outEl.appendChild(node);
            }
            //异步加载Css方法
            function AsynLoadCss(src, target, callback) {
                var node = document.createElement('link'),
                        outEl;
                switch (target) {
                    case 'body':
                        outEl = document.body;
                        break;
                    case 'head':
                        outEl = document.getElementsByTagName('head')[0];
                        break;
                    default:
                        outEl = document.getElementsByTagName('head')[0];
                }
                node.rel = "stylesheet";
                node.type = 'text/css';
                if (node.addEventListener) {
                    node.addEventListener('load', callback, false);
                    node.addEventListener('error', function () {
                        //error function
                        //callback();
                    }, false);
                }
                else { // for IE6-8
                    node.onreadystatechange = function () {
                        var rs = node.readyState;
                        if (rs === 'loaded' || rs === 'complete') {
                            node.onreadystatechange = null;
                            callback();
                        }
                    };
                }
                node.href = src;
                outEl.appendChild(node);
            }

            </script>
        </body>
    </html>

  • 相关阅读:
    同一电脑登录多个github账号
    如何用HAProxy+Nginx实现负载均衡
    Windows10下 tensorflow-gpu 配置
    机器学习数据处理时label错位对未来数据做预测
    机器学习经典模型简单使用及归一化(标准化)影响
    学机器学习,不会数据处理怎么行?—— 二、Pandas详解
    版本控制系统 git 之基础讲解
    学机器学习,不会数据处理怎么行?—— 一、NumPy详解
    Reinforcement Learning 的那点事——强化学习(一)
    读研 or 工作?对计算机类专业学习的看法
  • 原文地址:https://www.cnblogs.com/lzf0514/p/2721453.html
Copyright © 2011-2022 走看看