最近用习惯了 import 和 export ,然后。太久没有用不搭建服务器环境,居然忘记了。以前是怎么在一个JS中引用另一JS的。
这里有两个js文件,convertPinyin.js和pingyin.js,其中convertPInyin.js中要引用pingyin.js。
方法1: 将两个JS放在同一个文件夹下
创建一个HTML文件。谁被调用,谁在前面,即:
方法2:在jS中创建匿名类引用另一个JS
在convertPinyin.js文件中写函数(例如myImport),引用pingyin.js。
1 var myImport = function(){ 2 var script = document.createElement("script"); 3 script.setAttribute("type", "text/javascript"); 4 script.setAttribute("src","libs/js/pingyin.js"); // 引用文件的路径 5 document.getElementsByTagName('head')[0].appendChild(script); // 引用文件 6 }
然后,为convertPinyin.js 添加初始化加载方法,并引用myImport()。
1 window.onload = function(){ 2 myImport(); 3 }
注:onload方法在页面加载后完成。所以,页面页面加载过程中并没有形成引用关系。还是有局限性的。
这里引用文件的路径不想相对于被引用的,而是相对于页面的。
总结
- ES6以后,如果独立运行服务器,可以使用import,在开始加载页面是就引用了。减少了诸多麻烦。
- 既不需要在每次引用js脚本时,都判断方法的引用关系。也不需要在js界面额外写方法。可以把更多的精力放在业务逻辑上,而非代码本身。