https://www.jmqz1000.com

深入理解HTML页面中引入JS文件的两种方法

一个完整的页面由HTML(结构) 、CSS( 表现)和JavaScript(行为)组成。那你知道如何在html' target='_blank'>HTML页面中引入JS文件吗?这篇文章就和大家讲讲HTML页面引入JS文件的两种方法,感兴趣的朋友可以参考一下,希望可以帮助到你!

要在HTML页面中引入JS文件,必须使用 script 标签,因为 script 标签会告诉JavaScript在什么地方开始执行和什么地方结束。

一、外部引入JS文件

在 title 标签下面, head 标签中导入JS文件,这样可以使HTML文件和JS文件分离,从而实现前后端分离的效果,而且这样写代码修改比较方便,同一个JS文件可以被多个HTML页面引用,所以项目中我们一般都会使用外部引入JS文件。

外部引入JS文件的代码如下:

 !DOCTYPE html 
 html 
 head 
 meta charset= UTF-8 
 title /title 
 script type= text/javascript src= js/index.js /script 
 /head 
 body 
 p id= demo 点击按钮将数组转为字符串 /p 
 button quot;myFunction() 点击 /button 
 /body 
 /html 

二、在HTML页面中嵌入JS文件

将JavaScript放在HTML页面的 body 标签里面,一般我们会把JS文件放在页面底部,这样不会干扰页面的内容。初学JavaScript时,会在HTML页面中嵌入JS文件,因为它比较简单,嵌入方法适用于代码不多的情况下,比如写一个小测试。

在HTML页面中嵌入JS文件的代码如下:

 !DOCTYPE html 
 html 
 head 
 meta charset= UTF-8 
 title /title 
 /head 
 body 
 p id= demo 点击按钮将数组转为字符串 /p 
 button quot;myFunction() 点击 /button 
 /body 
 script type= text/javascript 
 function myFunction(){
 var animal = [ dog , cat , elephant , tiger 
 var str=animal.toString();
 document.write( 类型是: +typeof(str)+ ,字符串是: +str); 
 /script 
 /html 

以上介绍了在HTML页面中引入JS文件的两种方法,各有优劣,至于选择哪种方法,看工作需要和个人习惯,初学者可以自己动手尝试,希望这篇文章对你有所帮助!

更多相关教程请访问 JavaScript视频教程 php公益培训

以上就是深入理解HTML页面中引入JS文件的两种方法的详细内容,其它编程语言

郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。

相关文章阅读