欢迎您访问 最编程 本站为您分享编程语言代码，编程技术文章！

热门搜索/Hot Search

您现在的位置是： 首页

脚本标签|学习笔记

最编程 2024-03-04 07:47:10
...

开发者学堂课程【HTML 基础入门学习：script 标签】学习笔记与课程紧密联系，让用户快速学习知识

课程地址：https://developer.aliyun.com/learning/course/465/detail/5720

script 标签

 

内容介绍

一、<script><script/>

二、<script><script/>的属性

 

一、<script><script/>

1、存放位置

是唯一一个既可置于 head 里、也可置于 body 里的标签

以前学的必须要放在 head 里，或者必须放在 body 里，此标签两个都可以放，可以根据自己的喜好进行选择。

今后将会讲解合适放在和 head 里更好，何时放在 body 里更好。

2、作用

定义客户端脚本或者引入脚本

 

二、<script><script/>的属性

1、必填属性

Type 指定脚本的类型,text/javascript

但一般接触到的刚开始的脚本其实都是 js 脚本，那么 type 属性它的值一般就填text/javascript。

2、选填属性

（1）Src // 外部脚本文件的 URL 引入外部 js 文件

（2）Defer // 规定是否对脚本执行进行延迟,直到页面加载为止，值和属性名一样

属性加入与否的结果：如果不加入这个属性的话，比如不管是引入外部脚本，那可能加进来以后就会执行js里面的代码做一些工作。

如果加了这个属性，比如引入 js，这个 js 放在头部，不是在头部加进来就会执行，而是等整个页面加载完成以后才会执行这个 js 所拥有的一些功能。

（3）Async 规定异步执行脚本(仅适用于外部脚本)，值和属性名相同

异步，必须引入外部js文件，这个属性才可以用。

它的作用就是比如页面加载会加载进来很多 js 文件、css 文件以及很多图片文件等等，可能有些文件会导致页面加载缓慢，其他文件也相对于会被拖慢。

如果加了这个属性之后那么它的加载和整个页面的加载相当于是两条线的，对整个页面没有很多的影响。

注意：Defer 和 Async 它们的值是它们本身。

3、举例

（1）内部引入

定义脚本，不引入外部文件，把 js 代码就写在了 script 里面和引入了外部文件。

<!DOCTYPE html><html>

<head>

<title></title>

</head>

<body>

</body></html>

//引入代码：

<!DOCTYPE html><html>

<head>

<title></title>

<script type="text/javascript">

alert(‘hello‘);

</script>

</head>

<body>

</body></html>

打印出 hello 并且是弹窗式的提醒。

将代码放在<body>里，刷新效果是一样的，只不过这时位于 body 之内。

此为 html 文件里内部定义脚本。

（2）外部引入<script type="text/javascript" async="" src="http:/ /www.google-analytics.com/ga.js"></script>

这个程序是否异步，如果不需要就把 async=““删掉就可以了。

刷新，因为这是随便的引入了一个js，可能被强调了，在 network 中可以看到请求一直是 pending。

这个例子可能不是很恰当，随便引入一个 js 文件，只要此 js 文件没有被强调即可。

此为引入外部的 js 文件方式。

4、结论

当学习 js 的时候就会知道所有的页面很多动态逻辑效果都是由 js 实现的。

上一篇： 强化漏洞的可移植性缺陷：与地域相关的比较

下一篇： SAP UI5 中 sap-ui-bootstrap script 脚本标记的属性说明。

推荐阅读