美文网首页
外引js — 先引入cdn,cdn失效时引入本地js

外引js — 先引入cdn,cdn失效时引入本地js

作者: 前端召唤师 | 来源:发表于2019-08-28 15:01 被阅读0次

    参考:http://www.tianshan277.com/563.html

    效果:


    引入错误cdn-js.png

    html:

    <!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="UTF-8">
            <title>js加载</title>
            <script>
                function errorload(elem) { //cdn错误
                    if (elem.getAttribute('data-errorTimes') == 1) { 
                        elem.onerror = null; // 执行完onerror事件后,置onerror=null 来清除onerror事件。
                        return;
                    }
                    elem.setAttribute('data-errorTimes', 1);
                    var _src = elem.getAttribute('data-localSrc');
                    loadScript(_src, elem);
                }
    
                function loadScript(_src, prevEl) { //引入本地js
                    var _el = document.createElement('script');
                    _el.src = _src;
                    if (prevEl) {
                        prevEl.parentNode.insertBefore(_el, prevEl.nextSibling);
                    } else {
                        document.body.appendChild(_el);
                    }
                }
            </script>
        </head>
        <body>
            <p>产品一</p>
            <p>产品二</p>
            <p>产品三</p>
            <p>产品四</p>
            <p>产品五</p>
    
            <script data-localSrc="js/jquery.js" type="text/javascript" src="https://cdn.bootcss.com/jquery/1.8.2/jquery.min.js"
             onerror="errorload(this);"></script>
            //此cdn是正确版,测试时可修改为错误版再测试
        </body>
    </html>
    
    

    相关文章

      网友评论

          本文标题:外引js — 先引入cdn,cdn失效时引入本地js

          本文链接:https://www.haomeiwen.com/subject/siapectx.html