您当前的位置: 首页 >  Java

Allen Su

暂无认证

  • 4浏览

    0关注

    431博文

    0收益

  • 0浏览

    0点赞

    0打赏

    0留言

私信
关注
热门博文

【JavaScript 教程系列第 2 篇】如何在 HTML 中引入 JavaScript

Allen Su 发布时间:2019-11-03 17:09:15 ,浏览量:4

这是【JavaScript 教程系列第 2 篇】,如果觉得有用的话,欢迎关注专栏。

首先,我们需要知道的是,JavaScript 文件不能独立运行,需要将其导入到网页中,通过浏览器执行。

如何导入呢 ?

文章目录
      • HTML 中引入 JavaScript
        • 1:引入外部 JavaScript
        • 2:引入内部 JavaScript

HTML 中引入 JavaScript

想要在 HTML 中引入 JavaScript ,一般有两种方式

  • 方式一:引入外部 JavaScript
  • 方式二:引入内部 JavaScript

无论我们使用哪种引入 JavaScript 的方式,都要用到 script 标签。在 script 标签中有一个 src 属性,它的属性值是引入的 JavaScript 文件路径,其中,src 是英文 source(源)的简写形式。

1:引入外部 JavaScript

外部 JavaScript ,就是我们把 HTML 代码和 JavaScript 代码分别放到不同的文件中,再在 HTML 文档中使用 script 标签引入 JavaScript 代码。

我们可以在 head 标签 中引入外部 JavaScript ,也可以在 body 标签中引入。

语法




	
	
	
	


	
	


举例说明

这里我分别

  • 新建一个存储 .html 类型文件的文件夹 html,该文件夹下有一个 HTMDemo.html 的文件。
  • 新建一个存储 .js 类型文件的文件夹 js,该文件夹下有一个 test.js 的文件。

如下图所示 在这里插入图片描述 我以在 body 标签中引入外部 JavaScript 为例,局部代码如下所示


	

其中,script 标签内的代码表示引入文件名为 test.js 的 JavaScript 文件,该 js 文件的路径是 “js/test.js” 。

实际开发中,我们一般采用的就是引入外部 JavaScript 。

2:引入内部 JavaScript

内部 JavaScript,是指把 HTML 代码和 JavaScript 代码放在同一个文件中,和引入外部 JavaScript 一样,你可以在 head 标签中引入,也可以在 body 标签中引入,不过一般我们习惯在 head 标签中引入。

局部代码如下所示


	
	
	
		document.write("今天应做的事没有做,明天再早也是耽误了")
	

浏览器运行效果如下所示 在这里插入图片描述

另外,在其它地方你可能会看到这种写法,如下所示


而我们上面的代码中是没有 type 这个属性的,这是为什么呢 ?

这是因为现在的浏览器默认 script 标签的脚本类型为 JavaScript ,因此可以省略 type 属性,不过,如果考虑到兼容早期版本浏览器,就需要设置 type 属性了。

你的问题得到解决了吗?欢迎在评论区留言。

赠人玫瑰,手有余香,如果觉得文章不错,希望可以给个一键三连,感谢。

结束语 技术是一点一点积累的,大神也不是一天就可以达到的。原地不动就是退步,所以每天进步一点点。 最后,附上一句格言:"好学若饥,谦卑若愚",望共勉。
关注
打赏
1656491068
查看更多评论
立即登录/注册

微信扫码登录

0.0490s