今天结构化整理了自己的js模块,感觉还不错。各js之间的联系,真的很微妙,虽然现在还不是很清楚这种微妙的到底是什么,只会糊里糊涂地用。一个js文件中的方法,可以在另一个js文件里调用使用,而这调用可以直接调用。突然想到,难道是js页面导入到页面,逐行执行,生产一个整体的文件,所以后面嵌入的js文件,可以自如地调用前面嵌入js文件中的方法和全局变量嘛。刚刚测试一下,好像真是这么一回事呢。我得出两个结论,供大家共享。
页面代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <script type="text/javascript" src="1.js"></script> <script type="text/javascript" src="2.js"></script> </head> <body> </body> </html>
一、前面嵌入的js文件(1.js)中如果有成员变量s1与方法名s1()相同,后面
嵌入的js(2.js)文件中调用1.js中的成员变量s1可以,调用s1()时,会成错,
错为:缺少函数。
1.js代码: var s1="我是1.js中的s1成员变量"; function s1(){ alert("我是1.js中的s1成员方法"); }
2.js代码: function s2(){ alert(s1);//可以得到结果:我是1.js中的s1成员变量 //s1();//执行会出错;错为:缺少函数。 } window.onload=s2;
二、前面嵌入的js文件(1.js)中如果有一个成员变量s1或有一个方法名s1()
,后面嵌入的js(2.js)文件中也有一个成员变量s1或有一个方法名s1();那么
调用成员变量s1或调用s1()时,执行2.js时结果会采取就近原则。执行1.js时
结果会采取就后原则。
1.js代码:
var s1="我是1.js中的s1成员变量"; function s(){ alert(s1); }
2.js代码:
var s1="我是2.js中的s1成员变量"; function s2(){ alert(s1); } window.onload=s2;//可以得到结果:我是2.js中的s1成员变量 window.onload=s;//可以得到结果:我是2.js中的s1成员变量
感觉开发,还是要冷静心情,手脚勤快,遇困别躲。整理中发现,自己还不是不会多想想,老是出一些小问题,费了很多时间。这也可能跟自己的懒惰也有很大的关系。还是马马虎虎命名,不肯定认认真真敲代码,一心想减少些麻烦,把代码拷来考去。