美文网首页
外引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