script 标签|学习笔记

简介: 快速学习 script 标签

开发者学堂课程【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、选填属性

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

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

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

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

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

异步,必须引入外部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 实现的。

相关文章
|
Windows
代码签名证书如何申请
代码签名证书如何申请
415 0
|
存储 Kubernetes 安全
kubernetes集群降级|k8s1.24+版本降级到1.23
kubernetes集群降级|k8s1.24+版本降级到1.23
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的宠物服务中心的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的宠物服务中心的详细设计和实现(源码+lw+部署文档+讲解等)
109 6
基于SpringBoot+Vue+uniapp的宠物服务中心的详细设计和实现(源码+lw+部署文档+讲解等)
|
存储 搜索推荐 虚拟化
【云服务器】对比传统服务器,为什么说云服务器更具优势?
【云服务器】对比传统服务器,为什么说云服务器更具优势?
348 0
|
缓存 负载均衡 网络协议
前端面试题总结(react版)7
前端面试题总结(react版)7
|
存储 Java Linux
Linux版ZooKeeper安装
ZooKeeper服务器是用Java创建的,它运行在JVM之上。需要安装JDK 7或更高版本。
|
算法 Ubuntu Java
译 | Profiling Go Programs(一)
译 | Profiling Go Programs
234 0
|
Linux 开发者 网络协议
CCNP必备:Linux网络及0SI7层模型深入讲解(二)|学习笔记
快速学习CCNP必备:Linux网络及0SI7层模型深入讲解
|
Linux Python
Centos7编译安装python3.7和pip3
Centos7编译安装python3.7和pip3
556 0
Centos7编译安装python3.7和pip3
|
jenkins 持续交付
借助URLOS快速安装jenkins-持续集成工具
简介 Jenkins是一个开源的、提供友好操作界面的持续集成(CI)工具,起源于Hudson(Hudson是商用的),主要用于持续、自动的构建/测试软件项目、监控外部任务的运行(这个比较抽象,暂且写上,不做解释)。
1272 0