`
bingyalengxuan
  • 浏览: 19597 次
  • 性别: Icon_minigender_2
  • 来自: 石家庄
社区版块
存档分类
最新评论

加载js代码

阅读更多

      要在一个按钮上加载一个js文件里的代码,这个对我来说还真是有点难,刚刚能写几句js的我,面对这个问题,手足无措。于是,去请教同事,在同事的帮助下,写完了一段原生的加载js代码的片段。

 

(function(){
    function createStandardXHR() {
        try {
            return new window.XMLHttpRequest();
        } catch( e ) {}
    }

    function createActiveXHR() {
        try {
            return new window.ActiveXObject( "Microsoft.XMLHTTP" );
        } catch( e ) {}
    }

    var xhr = window.ActiveXObject ?
        function() {
            return !this.isLocal && createStandardXHR() || createActiveXHR();
        } :
        createStandardXHR();
    xhr.onreadystatechange=function() {
        if (xhr.readyState==4) {
            if((xhr.status >= 200 && xhr.status <= 300) || xhr.status == 304){
                eval(xhr.responseText);
            }
        }
    }
    xhr.open('get','url',false);
    xhr.send(null);
})();

 用ajax请求去请求js里的代码,这段代码我要消化一会儿。

另一个同事看完我们写的这段代码,说这样子去请求不好,还涉及到跨域的问题。(跨域,我要上网查了,嘻嘻)他建议我去创建一个element对象,然后拼一个script标签出来。嗯,这个主意不错。

(function loadScript(url){
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.setAttribute('charset','utf-8')
    var d=new Date(),token = d.getFullYear()+ '' + (d.getMonth()+ 1) + '' + d.getDate();
    script.src = "url?" + token;
    document.body.appendChild(script);
})();
 

 

分享到:
评论

相关推荐

    大图片分块加载JS代码

    接下来,我们编写JavaScript代码。这里假设有一个名为`js/main.js`的文件,用于处理图片的分块加载。首先,获取图片元素,并读取其`data-src`属性: ```javascript var imgElement = document.getElementById('...

    类似淘宝图片加载JS代码 可以减少服务器负担

    本篇文章将深入探讨“类似淘宝图片加载JS代码”的工作原理和实现方式,帮助你理解如何通过前端技术优化图片加载,提升网站性能。 1. **延迟加载(Lazy Loading)** - 延迟加载是一种优化策略,它只在用户滚动到...

    几种延迟加载JS代码的方法加快网页的访问速度

    JavaScript代码的加载往往占据了页面加载时间的相当部分,因此,延迟加载JavaScript代码成为优化网页性能的一种有效策略。本文将介绍三种延迟加载JS代码的方法,以帮助加快网页的访问速度。 1. **延迟加载JS代码** ...

    延迟加载js代码下载(包括页面延迟加载以及图片延迟加载)

    本篇文章将详细讲解延迟加载在JavaScript(js)和jQuery中的应用,以及如何实现页面和图片的延迟加载。 一、延迟加载的概念 延迟加载,也称为懒加载(Lazy Loading),是指在需要时才加载资源的技术。这种技术主要...

    vue动态加载外部依赖js代码实现

    通过将动态加载JS文件的功能封装为Vue组件,不仅能够简化代码结构,还能增强代码的可维护性和可复用性。这种方式非常适合那些需要灵活管理和控制外部资源加载的应用场景。希望本文能为开发者提供一个实用且高效的...

    使用BootStrap原生分页按钮 动态加载JS代码

    如果你是自己想写分页,或者用bootStrap的分页按钮。这段代码应该有帮助的。

    延时加载JavaScript代码提高速度

    在处理含有大量JavaScript代码的网页时,如果不采取任何优化措施,这些代码会在页面加载时同步执行,从而影响页面的渲染速度。本文将详细介绍如何通过延时加载JavaScript代码来提高网页的加载速度。 首先,我们可以...

    js异步加载代码

    在"asyLoad.js"这个文件中,我们可以预期它包含了一段用于实现JavaScript异步加载的代码。下面将详细介绍异步加载的原理和常见实现方法。 1. **异步加载的原理**: - 使用`&lt;script&gt;`标签的`async`属性:当`async`...

    Google的跟踪代码 动态加载js代码方法应用

    然而,由于JavaScript代码的加载可能会造成页面渲染的阻塞,从而影响用户体验,因此动态加载js代码的方法应运而生。 动态加载js代码是指在网页加载过程中,并不立即加载所有的JavaScript文件,而是根据需要在特定的...

    javascript函数动态加载javascript文件

    加载JS文件时,可以创建一个新的XMLHttpRequest实例,打开到目标URL的连接,然后发送请求。当服务器响应时,将返回的JS代码插入到`&lt;script&gt;`标签中。例如: ```javascript var xhr = new XMLHttpRequest(); xhr....

    动态加载外部JS文件

    动态加载则改变了这一模式,它使用JavaScript代码来异步请求并插入外部脚本,使得页面可以先呈现基本内容,而JavaScript文件则在后台加载,提高了用户体验。 二、动态加载的方法 1. 使用`&lt;script&gt;`标签的`async`和...

    vue动态加载js.zip

    Vue动态加载JS是一种实现这一需求的技术,它允许我们在运行时根据需要加载JavaScript文件。本文将深入探讨Vue动态加载JavaScript的原理、方法以及其实现步骤。 首先,我们需要理解Vue动态加载的核心概念。在HTML中...

    6种显示网页正在加载中的代码

    本篇文章将深入探讨6种显示网页正在加载中的代码实现方式。 1. **简单文本提示**:最基础的加载提示是通过在页面中央显示简单的文本,如“加载中...”或“请稍候”。这可以通过JavaScript和CSS轻松实现。例如,可以...

    1号店完整代码_js代码_一号店代码_京东1号店_

    - **js**:JavaScript代码库,包含实现上述功能的具体代码。 - **.idea**:这是IDE(如IntelliJ IDEA)的工作目录,包含了项目配置信息,对开发者来说很有用,但对最终用户来说是不可见的。 综上所述,这个项目是一...

    javascript页面加载完执行事件代码

    掌握页面加载完毕后执行JavaScript代码的方法对于开发者来说至关重要。本文将深入探讨如何在页面加载完成后执行特定的JavaScript事件代码,以及在实现此功能时需要注意的几个关键点。 首先,介绍页面加载状态的判断...

    JavaScript实现网页加载进度条代码超简单

    网页进度条能够更好的...因此我们需要通过html代码逐行加载的特性,在整页代码的若干个跳跃行数中设置节点,进行大概的模糊进度反馈来实现进度加载的效果。大致意思是:页面每加载到指定区域,则返回(n)%的进度结果,

    最后加载js的代码

    简单来说,就是在确保页面主要内容已经呈现给用户之后再加载执行JavaScript代码。这样做的好处是: - **提升首屏加载速度**:用户可以在最短时间内看到页面的基本结构和内容。 - **减少资源阻塞**:避免了JS文件下载...

    Java语言-动态编译代码并热加载类

    然而,这里标签中提到的"js热加载"可能是指JavaScript与Java的交互,比如使用JavaScript引擎如Nashorn(Java 8)或GraalVM在Java应用中执行JavaScript代码,并实现在运行时更新JavaScript逻辑。尽管Nashorn在Java 15...

Global site tag (gtag.js) - Google Analytics