`

如何在Javascript中包含Javascript

阅读更多

现在常用的一种javascript的方法是在当前的html文档中插入一个script标签,在标签中引入script脚本

 

var __includes__ = new Array;  
Array.prototype.indexOf = function(obj){ for(var i = 0; i < this.length; i++){if (this[i] == obj)return i;}return -1;}
		Array.prototype.add = function(obj){this[this.length] = obj;}
function include_js(js)
{
	if (__includes__.indexOf(js) > -1)return;
	__includes__.add(js);
	var head = document.getElementsByTagName('head')[0];	
	script = document.createElement('script');
	script.src = js;
	script.type = 'text/javascript';
	head.appendChild(script);
}

 

当你只是在你的htmlw文档中使用这个方法的时候,一切OK,这其实是script的标签的一种快捷的写法而已。

但是,如果你在一个javascript使用这个方法,问题就来了,比如

我在test.js中使用include_js("test1.js"),在test1.js中有一个变量test1是在test.js中要使用的,在webkit中尽然出现了test1变量未定义的错误,我不知道ie和firefox是否有这种问题,我想可能是include_js本身不是同步执行导致的,所以我只好使用以下方法来完善inlcude_js

 

 

 

var __includes__ = new Array;  
Array.prototype.indexOf = function(obj){ for(var i = 0; i < this.length; i++){if (this[i] == obj)return i;}return -1;}
		Array.prototype.add = function(obj){this[this.length] = obj;}
		
function xhttp(url, callback)
{
    var request = null;
    if (typeof XMLHttpRequest != 'undefined') {
        request = new XMLHttpRequest();
    }
    else if (typeof ActiveXObject != 'undefined') {
        request = new ActiveXObject('Microsoft.XMLHTTP');
    }
    request.open('GET', url, true);
    request.onreadystatechange = function () {
        if (request.readyState == 4) {
            callback(request.responseText);
        }
    };
    request.send(null);			
}
function add_scripts(jss, callback)
{
    var func = function( jss, idx, callback){
        if (idx == jss.length) {callback();return};
        add_script(jss[idx], function(){func(jss, ++idx, callback);});
    }
    func(jss, 0, callback);
}
function add_script(js, callback)
{
    if (__includes__.indexOf(js) > -1){callback();return;}
    __includes__.add(js);    
    xhttp(js, function(js_content){
        var head = document.getElementsByTagName('head')[0];	
        script = document.createElement('script');
        head.appendChild(script);
        script.innerHTML = js_content;
        callback();
    });
}
		
		function include_js(js)
		{
			if (__includes__.indexOf(js) > -1)return;
			__includes__.add(js);
			var head = document.getElementsByTagName('head')[0];	
			script = document.createElement('script');
			script.src = js;
			script.type = 'text/javascript';
			head.appendChild(script);
		}	

 

 当我在html文档中引入的时候,我用 include_js,当我在js文件中引入js时候,我使用

 

add_scripts(['test1.js', 'test2.js']), function(){
//代码主体

});

 

 add_scripts方法使用了xmlhttp来读入js内容,并把读入的内容的写到一个新的script标签内,读入是异步执行的,当执行完毕后,会调用callback、

 

import javascript in javascript

 

include javascript in javascript

分享到:
评论

相关推荐

    javascript中文手册 javascript中文手册

    变量在JavaScript中可以动态声明和赋值,数据类型包括基本类型(如字符串、数字、布尔值)和引用类型(如对象和数组)。运算符则用于处理这些数据,如算术运算符、比较运算符和逻辑运算符。流程控制结构使程序可以...

    javaScript 中文开发文档

    闭包是JavaScript中的一个重要特性,允许函数访问并操作其词法作用域内的变量,即使该函数已经执行完毕。 4. **函数式编程**:JavaScript支持函数式编程范式,如高阶函数、函数作为一等公民、函数组合和柯里化等...

    head first JavaScript源码

    函数是JavaScript中的另一个核心概念,它是一段可重复使用的代码块。函数可以接受参数并返回值,有助于代码的模块化和重用。另外,JavaScript还支持匿名函数和立即执行函数表达式,这在编写回调函数或封装代码时非常...

    javascript中文参考手册

    在JavaScript中,基础语法包括变量声明(var、let、const)、数据类型(如字符串、数字、布尔值、null、undefined、对象、数组、Symbol、BigInt)以及运算符(算术、比较、逻辑、位运算、赋值)。控制结构有条件语句...

    JavaScript486实例包含源文件

    在486个实例中,你可能会遇到各种JavaScript的高级特性,例如闭包、原型链、异步编程(包括回调函数、Promise和async/await)、模块化(如CommonJS和ES6模块)、事件处理、DOM操作以及AJAX请求等。这些实例将帮助你...

    JavaScript权威指南(JavaScript犀牛书一本)

    3. **作用域和闭包**:解析了JavaScript中的变量作用域规则以及闭包的概念,这是解决许多复杂问题的基础。 4. **异步编程**:详述了事件循环、回调函数、Promise、async/await等异步处理方式,帮助开发者应对...

    javascript课程内容总结

    在 JavaScript 中,数据类型包括字符串(string)、数值型(number)、布尔型(boolean)、null、undefined 和对象(object)。其中数组(array)属于对象,判断数据类型需要使用 typeof() 函数。 变量 变量的命名...

    javascript中文参考资料

    "03 表达式与运算符.pdf"涉及了JavaScript中的算术、比较、逻辑及赋值运算符。表达式是能够产生值的语言结构,而运算符则是对这些值进行操作的符号。了解各种运算符的工作原理可以帮助开发者编写出更加高效和精确的...

    JavaScript语言精粹完整版

    函数是JavaScript中最核心的概念之一,它们不仅能够执行一系列任务,还可以作为值进行传递和返回。JavaScript中的函数具有闭包的特性,这意味着函数可以访问并操作其外部作用域中的变量。 #### 对象 JavaScript中的...

    ArcGis-for-javaScript最全中文API.pdf

    ArcGIS JavaScript API 的主要特点包括: * 基于 JavaScript 的开发工具,易于学习和使用 * 提供了一组强大且灵活的工具,允许开发者快速创建复杂的地图应用程序 * 兼容多种浏览器和设备,包括桌面电脑、笔记本电脑...

    JavaScript文档

    最后,“JavaScript对象与数组参考大全 .chm”专门关注JavaScript中的对象和数组,这是JavaScript编程中非常关键的部分。JavaScript是一种基于对象的语言,其核心就是对象和原型链。这个文档可能会详细讲解对象的...

    JavaScript 中各种特效 源码

    5. **表格操作**:在JavaScript中,可以动态地创建、修改和操作表格,比如插入、删除行或列,改变单元格内容,甚至实现表格排序和过滤功能。 6. 边框特效:通过JavaScript可以实现动态边框,如闪烁、滑动或渐变效果...

    javaScript

    - 松散类型:变量在JavaScript中不必声明数据类型,它在运行时自动确定。 - 基于对象和事件驱动:JavaScript的语法借鉴了C、C++和Java,包含条件判断、循环和运算符等结构,但它对对象属性的处理方式类似于哈希表或...

    JavaScript精华(常用JavaScript模块)

    在JavaScript中,我们可以使用CommonJS(Node.js环境)或ES6的导入导出(import/export)语法来实现模块化。CommonJS常用于服务器端,通过`require()`函数加载模块,而ES6模块则在浏览器和现代Node.js环境中使用,...

    Javascript参考手册中文版chm版

    在JavaScript中,函数是一等公民,这意味着它们可以作为其他函数的参数,也可以被赋值给变量,甚至可以作为其他函数的返回值。手册可能会涵盖函数表达式、函数声明以及箭头函数的使用。 JavaScript还支持原型继承和...

    [JavaScript入门]Eloquent JavaScript(2nd)

    书中介绍了JavaScript中的基本数据类型,包括数字、字符串和布尔值。数字是数学上的数字,可以进行数学运算;字符串是文本序列,由字符组成;布尔值代表逻辑上的“真”或“假”。此外,JavaScript还有一种特殊的值,...

    VS2015安装证书,JavaScript_ProjectSystem.msi,JavaScript_LanguageService.msi

    JavaScript Project System使得开发者能够在IDE中创建、编辑、调试和构建基于JavaScript的应用程序,包括Web应用、Node.js服务器端应用等。它提供了代码编辑器、调试工具、解决方案资源管理器中的项目节点、以及与...

    javascript帮助文档帮助学习javascript

    再者,"javascript5.chm"可能是关于JavaScript 5.0版本的文档,这个版本在ECMAScript 5中得到标准化,引入了许多重要的新特性,如对象字面量、函数表达式、数组和对象的方法等。通过这个文档,学习者可以深入理解这...

    JavaScript学习笔记,javascript基础知识,基础语法整理.pdf

    * 函数是JavaScript中的一种基本结构单元 * 函数可以封装一组语句,实现功能的复用 * 函数可以传递参数,实现参数的传递 * 函数可以返回值,实现结果的返回 三、 JavaScript 中的对象 * 对象是JavaScript中的一种...

Global site tag (gtag.js) - Google Analytics