Javaｓｃｒｉｐｔ的动态加载、缓存、更新和重用（1）

使用范围：

OA、MIS、ERP等信息管理项目，暂时不考虑网站。

遇到的问题：

完成一个项目，你经常需要引用大量的JS文件，如jquery.js，EasyUI，等等。有一些列的JS文件，你写的，那么这些文件装入容易，如何在客户端如果文件的变化及时更新缓存如果你能提高跑步效率就更好了。

目的：

1，js文件可以方便地引用。

2。尽可能使用各种缓存，避免频繁地从服务器读取文件。

3，如果js文件被更新或增加，并减少了一些js文件，则客户端必须自动并立即更新。

4，Js文件重用。

页面结构：

一般来说，OA、MIS、等项目大多在frameset或iframe的方式实现的，因此具有父页面和子页面的概念。我们可以利用这一点来做文章。

Web页面可以分为三个部分：shell、主页、标签、数据列表、表单（添加、修改）。由于这里加载js的方法，需要使用此页面结构，正是由于这个原因，它暂时不支持该站点。

看这张照片有点眼熟。
文本

现在做应用程序的Web版，更对各种js更依赖第三方jQuery EasyUI，my97，等等，以及各种JS自己。更多的功能需要实现，越来越多的JS是必要的，和JS文件的修改频繁，所以有很多问题，就像每一页写了很多页。这是添加一个新的js文件太麻烦了，多少页你需要改变吗js文件是如何更新以允许客户端立即更新的如何让客户端更快地加载js。一些js文件有依赖项，以及如何确保加载顺序本文的内容是分享我的解决方案。

动态加载

在页面中使用加载js显然很麻烦，那么您要做什么呢它是用来解决动态加载的方法。那里的搜索在互联网上，有许多方法来写它本身和被组织成一个框架（如seejs）。有时我觉得更适合，所以我计划写一套。

如何动态加载它你使用jQuery提供的方法吗这是可以的，但是页面必须引用jQuery和我写的js来加载js文件，也就是说要写两个页面，这很麻烦。写一个，不要写两个，虽然它只有一个，但是这是非常麻烦的。所以决定自己编写一个动态加载的小方法。

什么不能做百度阿姨帮帮忙。各种搜索，终于找到了比较理想的方法，你得用这个。

复制代码代码如下所示：
*实现动态加载JS的功能，从互联网上，做了一点修改，可以兼容IE10。
VaR加载脚本=
{
Suoyuan：功能（ID）document.getelementbyid（ID）{ return }，
标签：功能（元）{ return document.getelementsbytagname（元）；}，
Ce：功能（元）{ return document.createelement（元）；}，
Js：函数（URL，回调）{
var = loadｓｃｒｉｐｔ.ce（'ｓｃｒｉｐｔ）；
号=文本/ javaｓｃｒｉｐｔ；
s.src =网址；
如果（document.documentmode = = 10 | | { document.documentmode = = 9）
s.onerror = s.onload =装；
{人}
s.onreadystatechange =准备；
s.onerror = s.onload =装；
}
Loadｓｃｒｉｐｔ.tag（很）{ 0 }。appendChild（S）；

功能准备（）{ / * * / / ie10.0 IE7.0
如果（s.readystate = = 'loaded| | { s.readystate = =完整的）
回调（）；
}
}

函数加载（）{ / * * /铬/ ie10.0
回调（）；
}
}
}；
加载顺序

而且新的代码已经修复，这里是如何加载其他js文件，因为文件比较多，有一定的依赖性，多考虑一下或者得到一个js文件字典，然后按照加载顺序做一个加载顺序。

为了更稳定，决定使用单负载方法，即加载js，然后加载另一个js。这确保了依赖性。当然，缺点是加载速度会慢一些。一般的网页加载JS可以与多个js文件一起下载，而且这个速度会更快。

使用缓存

一般的浏览器都会有各种资源的缓存，如网页、图片、js、CSS等，不会再下载到服务器上，看起来不错，但有两个问题：

A，浏览器如何判断缓存的js文件是最新的

更新了B和js文件。如何强制浏览器更新

浏览器如何判断具体的步骤，我不知道，只知道一步是问我服务器缓存JS文件是不是新的，然后才能确定是否本地缓存的更新，如果最新的是令人沮丧的，如果不去下载最新的。也就是说，即使客户有一个js文件缓存，但是浏览器来确认它是否是最新的，或将服务器问。这是一个折腾，总的过程，，这个过程会很快，但有时这个过程将是缓慢的。

因此，尽量避免尽可能地加载js，从而使JS文件被重用。

更新js文件

js文件被更新了，但是浏览器仍然使用以前的js文件，因为缓存，但也坚持认为缓存的js文件是最新的，什么啊

最简单的方法是加载JS，其次是版本号，更新，和版本号+ 1.for例子，XXX。JSV = 1. js文件被更新，这是XXX。JSV = 2.so JS肯定会更新。

这似乎很简单，但是这个版本又是怎样的呢版本号本身是如何更新的

复用

让我们来看看上面这张图，页面结构，外壳的页面（或首页），我们称之为母页。有几个iframe加载的页面中，我们添加的子页面。

The general practice is to load the jQuery.js in the parent page, and then the jQuery.js is loaded on the subpage.Of course, when the page loading jQuery.js, extracted directly from the cache, generally do not go over the server.

但是，由于父页面被加载，为什么页面要重新加载可以在父页面上直接加载一个好的行吗在网上搜索，似乎没有人这样做。也许我太不一样了。我只是想做的好处是，所有的JS文件加载在父页面和子页面，直接装在母页好JS，这样子不需要把js文件，效率也会更高。毕竟，使用缓存加载也是一种判断。然后，当加载动作时，会有一点损失。js文件越多，就越明显。

那么怎么做呢，似乎很简单。

在父页面中使用jQuery

AA = $（var 'div '）； / /发现div所有父页

有可能在子页面吗

VaR BB =顶部。$（'div '）； / /找到div，但不是div但父亲网页部

怎么了究其原因是由于search.jquery范围有三个参数，我们只使用第一个，而后面被忽略。所以第二参数是什么它是搜索范围。当没有指定jQuery时，它在哪里搜索在页面中加载jQuery搜索的页面，而不是调用$的页面。

这个解决方案非常简单，参数的添加也很好。

VaR BB =顶部。$（'div文件）； / /指定搜索范围：子页的文件

等一下.这似乎很烦人。当我们编写脚本时，我们需要考虑这个脚本是在父页面还是在子页面中执行的。

嗯，做一个简单的方案来避免这个麻烦。在子页写一个函数

复制代码代码如下所示：
函数$（P1）{
返回顶部。$（P1，文档）；
}
嗯，你做完了吗当然不是!了解如何预测，请下次收听。

ps：下一套通知。是具体代码的实现，有一些想法和想法，不知道你什么都不想知道，在有些话，欢迎回复如下。谢谢。