当前位置: 首页 > article >正文

写一个加载远程js的函数,function loadJSFn(sucCb,failCb){}, 要考虑到低端浏览器的兼容性;

function loadJSFn(url, sucCb, failCb) {
  var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src = url + (url.indexOf('?') === -1 ? '?' : '&') + 'random=' + Math.random();
  if (typeof sucCb === 'function') {
    if (script.readyState){ // IE
      script.onreadystatechange = function(){
        if (script.readyState == "loaded" || script.readyState == "complete"){
          script.onreadystatechange = null;
          sucCb();
        }
      };
    } else { // Other browsers
      script.onload = function() {
        sucCb();
      };
    }
  }
  if (typeof failCb === 'function') {
    script.onerror = function() {
      failCb();
    };
  }
  document.body.appendChild(script);
}

为了提高加载远程 JS 的函数的兼容性,你可以考虑以下几点:

  1. 使用 async 和 defer 属性

在创建 <script> 元素时,为了避免阻塞页面的渲染和响应,你可以添加 asyncdefer 属性。async 属性告诉浏览器可以异步加载该脚本,不会阻塞页面的加载和渲染;而 defer 属性告诉浏览器在 HTML 解析完成后再执行脚本,这样可以保证脚本在正确的上下文中运行,并且不会影响页面的渲染。

  1. 处理 onload 和 onerror 事件

除了使用 addEventListener 方法处理 loaderror 事件外,你还可以使用 DOM 元素的 onloadonerror 属性来处理这些事件。这种方式更加兼容旧版浏览器。

  1. 将脚本插入到 body 中

有些浏览器或环境可能不支持将脚本插入到头部(head)中,因此你可以尝试将脚本插入到 body 中。


http://www.kler.cn/a/15045.html

相关文章:

  • Java 设计模式 详解
  • Spring、SpringMVC、SpringBoot、Mybatis小结
  • 笔记02----重新思考轻量化视觉Transformer中的局部感知CloFormer(即插即用)
  • 基本数据类型:Kotlin、Dart (Flutter)、Java 和 C++ 的比较
  • 【电子设计】按键LED控制与FreeRTOS
  • 深入理解Redis(七)----Redis实现分布式锁
  • 如何基于vue实现倒计时效果
  • 字节的面试,你能扛住几道?
  • NetSuite 负库存控制功能包
  • Go分布式爬虫笔记(二十)
  • promise的作用
  • huggingface下载的.arrow数据集读取与使用说明
  • 初学者入门C语言指针与链表
  • CVE漏洞复现-CVE-2019-11043-PHP-FPM 远程代码执行漏洞
  • 地热井监测控制系统解决方案
  • 适用于Windows PC和Mac的最佳录屏软件Camtasia2023强悍来袭
  • C++设计模式21:策略模式
  • 如何高质量的提问题让chatgpt更明白我们的意图
  • delphi JSON用法
  • static_cast、dynamic_cast和reinterpret_cast区别和联系
  • 最好用的六款虚拟机软件,赶紧收藏
  • SAP-选择实施离散制造模式还是重复制造模式?
  • Java 版企业工程项目管理系统平台(三控:进度组织、质量安全、预算资金成本、二平台:招采、设计管理)
  • 根据字符出现频率排序、从英文中重建数字----2022/4/25
  • 直击德国PLS展,联诚发倾力打造沉浸式视觉盛宴!
  • 上传了ipa但iTunes Connect没有构建版本问题