`

如何在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中数值的处理方式,包括数值的表示、NaN、Infinity、parseInt和parseFloat方法等。对象章节则详细讲解了对象的生成、属性的读取和修改、以及对象引用等概念。特别地,还提到了类似数组的...

    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() 函数。 变量 变量的命名...

    arcgis api for javascript 中文帮助文档和demo

    在使用ArcGIS API for JavaScript时,首先要了解地图对象(Map),它是所有地图元素的基础,包含了地图的视图、图层、坐标系统等关键信息。然后,我们可以添加不同的图层类型,如TiledMapServiceLayer用于加载瓦片...

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

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

    JavaScript文档

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

    javaScript

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

    JavaScript精华(常用JavaScript模块)

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

    中英文javascript解释器

    在JavaScript中,OOP特性包括类、对象、继承和封装等。如果此文件包含中文关键字来实现这些概念,那么它将展示如何在支持中文的JavaScript环境中进行面向对象编程。 3. `test.ds`:这是另一个测试文件,可能用于...

    JavaScript 参考手册集合 chm版打包

    1. **变量**:JavaScript中,变量用于存储数据。使用`var`、`let`或`const`关键字来声明,它们可以用来保存各种数据类型,如数字、字符串、布尔值、null、undefined等。 2. **数据类型**:JavaScript有两类数据类型...

    [JavaScript入门]Eloquent JavaScript(2nd)

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

    Javascript参考手册中文版chm版

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

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

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

    javaScript api

    6. ES6及以后的新特性:JavaScript API也包括了ES6(ECMAScript 2015)及后续版本引入的新特性,如箭头函数、模板字符串、解构赋值、async/await等,这些增强了语言的表达力和可读性,使得代码更加简洁和高效。...

    javascript帮助文档帮助学习javascript

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

    JavaScript语言精粹(高清电子版)和高性能JavaScript 双语版

    7. **正则表达式**:用于文本匹配和处理的强大工具,及其在JavaScript中的应用。 接下来,我们转向《高性能JavaScript》。这本书的重点在于优化JavaScript代码的性能,确保应用程序的高效运行。书中可能包含以下...

Global site tag (gtag.js) - Google Analytics