zoukankan      html  css  js  c++  java
  • 动态加载Js文件的三种方法

    碰到需要加载多个Js文件的情况,使用选择性的动态加载Js ,可以提高页面显示的速度和效率。

    下面介绍三种异步执行加载Js 脚本的方法。

    1、直接document.write

    <script language="javascript">
        document.write("<script src='test.js'><\/script>");
    </script>

    2、动态改变已有script的src 属性

    <script src='' id="s1"></script>
    <script language="javascript">
        s1.src="test.js"
    </script>

    3、动态创建 script元素

    <script>
        var oHead = document.getElementsByTagName('HEAD').item(0);
        var oScript= document.createElement("script");
        oScript.type = "text/javascript";
        oScript.src="test.js";
        oHead.appendChild( oScript);
    </script>

    这三种方法都是异步的,所以在采用这类方法动态加载Js 的同时,主界面的Js脚本是继续执行的,所以可能出现通过异步加载的Js代码得不到预期的效果的情况。这时候可以考虑采用Ajax加载Js的方法。

    大概原理 :用XMLHTTP取得要脚本的内容,再创建 Script 对象。另外注意编码的保持一致。因为服务器与XML使用UTF8编码传送数据。

  • 相关阅读:
    Linux下查看tomcat版本
    React跳转路由传参3种方法和区别
    pc端布局方案
    vue针对搜索引擎做SEO优化
    vue-cli3配置vue.config.js持续更新
    MySQL连接语法(多表查询)
    MySQL约束和外键约束
    MySQL数据库查询
    MySQL数据库入门
    jQuery用法和bootstrap框架
  • 原文地址:https://www.cnblogs.com/see7di/p/2239789.html
Copyright © 2011-2022 走看看