首页 > 代码库 > JS预处理机制

JS预处理机制

2024-07-28 12:12:03   229人阅读

 IE中界面加载顺序为从上往下加载。。同步加载。。如 一个界面 70多个请求的情况下。 导致页面加载及其慢。


JS预处理机制：

大概原理：

    用XMLHTTP取得脚本的内容，再创建Script对象，另外注意编码保持一致，因为服务器和XML使用UTF8的编码传送数据。类似于预报加载这些js脚本文件。界面上尽量不要出现没有必要引用的js文件，减缓页面加载速度不说，还容易出现js错误。

     实现方式：1-3种方法是异步的，基本上都在一个主界面（需优化的界面上采取，动态写，改，生成一个script脚步）。来实现异步加载js。。所以，在采用这种方式优化时，主界面的js脚本是继续执行的。所以可能出现通过异步加载的js代码得不到预期的效果情况，这时候可以考虑采用Ajax加载js的方法





1.直接document.write  (通过dom 节点。生成一个导入的脚本)
<script language="javascript">
document.write("<script src=http://www.mamicode.com/‘test.js‘><script/>")
</script>


2.动态改变已有script的src属性  
<script src=http://www.mamicode.com/"" id="index">
</script>
<script language="javascript">
index.src=http://www.mamicode.com/"test.js";
</script>


3.动态创建script元素
<script>
  var oHead=document.getElementsByTagName("HEAD").item(0);
  var oScript=document.createElement("script");
  oScript.type="text/javascript";
  oScript.src=http://www.mamicode.com/"test.js";
  oHead.appendChild(oScript);
</script>




4。通过压缩，合并js方式处理

通过ajax异步加载一个js类
加载并执行一个 JS 文件。

jQuery 代码:
$.ajax({
  type: "GET",
  url: "test.js",
  dataType: "script"
});

JS预处理机制


联系
我们