下面2段javascript脚本教程的脚本输出的结果一样,请问有什么不同...

下面2段javascript的脚本输出的结果一样,请问有什么不同吗?第一段的好处是什么?_百度知道【转载】JavaScript输出脚本的执行顺序
JavaScript输出脚本的执行顺序
在JavaScript开发中,经常会使用document对象的write()方法输出JavaScript脚本。那么这些动态输出的脚本是如何执行的呢?例如:
document.write('&script&type="text/javascript"&');
document.write('f();&&&&');
document.write('function&f(){&&&');
document.write('&&&&alert(1);&&&');
document.write('}&&&');
document.write('&\/script&&&');
运行上面代码,我们会发现:document.write()方法先把输出的脚本字符串写入到脚本所在的文档位置,浏览器在解析完document.write()所在文档内容后,继续解析document.write()输出的内容,然后才按顺序解析后面的HTML文档。也就是说,JavaScript脚本输出的代码字符串会在输出后马上被执行。
请注意,使用document.write()方法输出的JavaScript脚本字符串必须放在同时被输出的&script&标签中,否则JavaScript解释器因为不能够识别这些合法的JavaScript代码,而作为普通的字符串显示在页面文档中。例如,下面的代码就会把JavaScript代码显示出来,而不是执行它。
document.write('f();&&&&');
document.write('function&f(){&&&');
document.write('&&&&alert(1);&&&');
document.write(');&&');&
但是,通过document.write()方法输出脚本并执行也存在一定的风险,因为不同JavaScript引擎对其执行顺序不同,同时不同浏览器在解析时也会出现Bug。
问题一,找不到通过document.write()方法导入的外部JavaScript文件中声明的变量或函数。例如,看下面示例代码。
document.write('&script&type="text/javascript"&src="test.js"&
&\/script&');
document.write('&script&type="text/javascript"&&');
document.write('alert(n);&&&');&//&IE提示找不到变量n
document.write('&\/script&&&');
alert(n+1);&&&&&&&&&&&&&&&&&&&&&//&所有浏览器都会提示找不到变量n
外部JavaScript文件(test.js)的代码如下:
var&n&=&1;&
分别在不同浏览器中进行测试,会发现提示语法错误,找不到变量n。也就是说,如果在JavaScript代码块中访问本代码块中使用document.write()方法输出的脚本中导入的外部JavaScript文件所包含的变量,会显示语法错误。同时,如果在IE浏览器中,不仅在脚本中,而且在输出的脚本中也会提示找不到输出的导入外部JavaScript文件的变量(表述有点长和绕,不懂的读者可以尝试运行上面代码即可明白)。
问题二,不同JavaScript引擎对输出的外部导入脚本的执行顺序略有不同。例如,看下面示例代码。
&script&type="text/javascript"&
document.write('&script&type="text/javascript"&src="test1.js"&
&\/script&');
document.write('&script&type="text/javascript"&&');
document.write('alert(2);')
document.write('alert(n+2);');
document.write('&\/script&');
&script&type="text/javascript"&
alert(n+3); &
&/script&&
外部JavaScript文件(test1.js)的代码如下所示。
var&n&=&1;
alert(n);&
在IE浏览器中的执行顺序如图1-6所示。
(点击查看大图)图1-6& IE
7浏览器的执行顺序和提示的语法错误
在符合DOM标准的浏览器中的执行顺序与IE浏览器不同,且没有语法错误,如图1-7所示的是在Firefox
3.0浏览器中的执行顺序。
(点击查看大图)图1-7& Firefox
3浏览器的执行顺序和提示的语法错误
解决不同浏览器存在的不同执行顺序,以及可能存在Bug。我们可以把凡是使用输出脚本导入的外部文件,都放在独立的代码块中,这样根据上面介绍的JavaScript代码块执行顺序,就可以避免这个问题。例如,针对上面示例,可以这样设计:
&script&type="text/javascript"&
document.write('&script&type="text/javascript"&src="test1.js"&&\/script&');
&script&type="text/javascript"&
document.write('&script&type="text/javascript"&&');
document.write('alert(2);&&&')&;&&&&&&&&//&提示2
document.write('alert(n+2);&');&&&&&&&&&//&提示3
document.write('&\/script&&&');
alert(n+3);&&&&&&&&&&&&&&&&&&&&&&&&&&&&&//&提示4
&/script& &
&script&type="text/javascript"&
alert(n+4);&&&&&&&&&&&&&&&&&&&&&&&&&&&&&//&提示5
&/script&&
这样在不同浏览器中都能够按顺序执行上面代码,且输出顺序都是1、2、3、4和5。存在问题的原因是:输出导入的脚本与当前JavaScript代码块之间的矛盾。如果单独输出就不会发生冲突了。
已投稿到:
以上网友发言只代表其个人观点,不代表新浪网的观点或立场。关于一个根据当前时间决定显示什么内容的JavaScript脚本问题 入门级_百度知道这有两段代码,为什么输出的结果不一样?_百度知道

参考资料

 

随机推荐